紙がめくれたようにするCSSを WordPress.com のテーマに適用する際に注意したほうがいいかもしれないこと

記事「[CSS]box-shadowを使って洗練されたエフェクトを加える二つのテクニック | コリス」等において、紙がめくれたようにするためのCSSが紹介されていますが、私の認識だと、ほとんどのテーマでは適用できません。

あれこれと調べてみると、どうやら、親要素に「z-index:1;position:relative;」を追加すれば適用できるようになるようです。

shadow01rect3015shadow02

例えば、テーマ「Twenty Eleven 」の場合は、以下のCSSを追加すると、下のほうの影がちゃんと表示されるようになりました。

.entry-content, .entry-summary {
position: relative;
z-index: 1;
}
関連情報

1件のコメント

  1. […] と思っていたところに、ピンポイントな記事が!Σ(゚ロ゚)o゙ […]

    いいね

 

以下に詳細を記入するか、アイコンをクリックしてログインしてください。

WordPress.com ロゴ

WordPress.com アカウントを使ってコメントしています。 ログアウト /  変更 )

Google フォト

Google アカウントを使ってコメントしています。 ログアウト /  変更 )

Twitter 画像

Twitter アカウントを使ってコメントしています。 ログアウト /  変更 )

Facebook の写真

Facebook アカウントを使ってコメントしています。 ログアウト /  変更 )

%s と連携中

%d人のブロガーが「いいね」をつけました。