重寫元素的CSS Inherance

不久，我在CSS中爲「p」寫了任何東西，這個元素的丟棄消失並覆蓋了所有的「p」規則。重寫元素的CSS Inherance

難道這是固定的，以保持內聯和「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%; 
}

來源

2017-04-04 Slasher

僅供參考：在FF中，這不是做任何事情:) – Martijn

刪除inline-flex規則修復了這個問題，但我不知道爲什麼。你爲什麼使用inline-flex？ – Ryan

只要我在CSS中寫的「P」什麼

不，這是特定於您的display: inline-flex聲明。這不僅僅是「什麼」。

flex容器不能包含::first-letter僞元素，因爲flex容器包含flex項目而不是格式化的行。這就是爲什麼使您的p元素彎曲容器禁用所有::first-letter規則。

目前還不清楚爲什麼當您不想在每個段落中創建柔性佈局（並且最令人擔憂的是you would not be the first）時使用display: inline-flex。改爲使用display: inline-block,display: table-cell或浮點數。

來源

2017-04-04 19:14:28 BoltClock

如果我使用diplay：inline-block解決了問題，但是上邊距消失了。 https://jsfiddle.net/Lfkf1dtx/1/ – Slasher

重寫元素的CSS Inherance

回答

相關問題