【初心者CSS】Cocoonで「斜めの背景」を使う方法

WEB
スポンサーリンク

【初心者CSS】Cocoonで「斜めの背景」を使う方法

LPなどで背景が斜めになったサイトをよく見ますよね。

WordPressでやってみたくていろいろ試してみた結果、こちらのサイトのソースだと簡単綺麗に実現可能でした!

こんなかんじ。

 

 

斜めの背景のサンプル

斜め背景に入れるコンテンツ斜め背景に入れるコンテンツ斜め背景に入れるコンテンツ斜め背景に入れるコンテンツ斜め背景に入れるコンテンツ斜め背景に入れるコンテンツ斜め背景に入れるコンテンツ斜め背景に入れるコンテンツ斜め背景に入れるコンテンツ斜め背景に入れるコンテンツ斜め背景に入れるコンテンツ斜め背景に入れるコンテンツ斜め背景に入れるコンテンツ斜め背景に入れるコンテンツ斜め背景に入れるコンテンツ斜め背景に入れるコンテンツ。

 

 

CSSは紹介されているものをそのまま使用します、が、Cocoonだとそのままでははみ出ちゃうので下記を加えました。

 /*mainからはみ出ている部分を隠す*/
#main {
overflow-x:
hidden;
}
 /*mainの1pxボーダーを表示しない*/
.main{
border: 0;
}

 

【初心者CSS】Cocoonで「斜めの背景」を使う方法 まとめ

短いですがメモしておきたかったので!

たねっぱ!さんありがとうございます!!

コメント

タイトルとURLをコピーしました