0

この例の最初の文字だけをターゲットにするのに問題があります: http://jsfiddle.net/gB94x/

明らかに、「続きを読む」にもドロップキャップがあるはずはありません。

HTML は変更できません。これは固定テンプレートの一部です。

ありがとう!

4

2 に答える 2

3

.od_article>pp直接の子であるすべてのタグを参照し.od_article、そこに問題があります。p最初のタグだけが必要です。以下の更新されたフィドルのように変更.od_article>p:first-letterします。.od_article>p:first-of-type:first-letter

http://jsfiddle.net/gB94x/1/

アップデート:

:first-of-type残念ながら、IE7 が をサポートしているとは思えません。どちらもサポートしているかどうかはわかりません:first-childが、参考までに、:first-child適用される要素がその親の最初の子である場合に一致します。

頭のてっぺんから回避策を思いつくことはできませんがp、最初の文字を変更したい HTML を見ると、 class がありCaptionPic1ます。最初の段落に常にこのクラスがある場合は、それを使用して.CaptionPic1:first-letterください。

于 2012-04-27T02:33:23.037 に答える
1

あなたのセレクター:

.od_article>p:first-letter

親が class を持つすべて の子の最初の文字にスタイルを適用しようとしています。pod_article

pこれを使用して最初の要素を取得できます。

.od_article>p:first-of-type:first-letter

または、 などの CSS3 疑似クラスを理解しない IE7 や IE8 などの古いブラウザをサポートする必要があり、HTML 構造で:first-of-type最初の子が常に でh1あり、最初の子が常にそれにp続くことがわかっている場合は、次のような兄弟セレクターを使用します。h1:first-child

.od_article>h1:first-child+p:first-letter

jsFiddle プレビュー

于 2012-04-27T04:37:13.960 に答える