オーバーライドされた要素のCSS継承

Question

すぐに、私はCSSの "p"のために何かを書きます。この要素の継承は消滅し、すべての "p"規則をオーバーライドします。

「p」要素のインラインとスタイルを維持するためにこれを修正できますか？

p:first-of-type::first-letter { 
    font-size: 25px; 
    font-weight: bold; 
} 

p:nth-of-type(2)::first-letter { 
    font-size: 25px; 
    font-weight: bold; 
} 

    p:nth-of-type(3)::first-letter { 
    font-size: 25px; 
    font-weight: bold; 
} 

/* inline container */ 
p {        
    display: inline-flex; 
    width: 33%; 
} 

Answer 1

すぐに私はCSSで "P" のために何を書いて

はありません、これはあなたのdisplay: inline-flex宣言に固有のものです。それは単なる「何か」ではない。

フレックスコンテナには、擬似要素が含まれていない可能性があります。フレックスコンテナには、書式付き線ではなくフレックスアイテムが含まれているためです。そのため、あなたのp要素をフレックスコンテナにすると、すべての::first-letterルールが無効になります。

display: inline-flexを使用する理由は明確ではありませんが、各段落内でフレックスレイアウトを作成しようとしていないとき（そして最も驚いたことに、you would not be the first）です。代わりにdisplay: inline-block,display: table-cell、または浮動小数点数を使用してください。