html - 标题 <h1> 中 <br> 之后的其他字体大小

Question

好的，事情是这样的。我的

标题需要 2 种不同的字体大小。
之后的文本需要比之前的文本大。

<h1>Welcome text from<br>Name</h1>

所以我试了一下

h1 {
  color: #c3c2c2;
  font-size: 35px;
}

h1 br:after {
  font-size: 50px;
}

但这行不通，有什么想法或建议吗？

Answer 1

如果您不想或不能更改标记，您可以使用 :first-line来自 CSS3 的选择器。像这样:

 <h1>Welcome text from <br/> Name</h1> 

 h1 { 
   color: #c3c2c2; 
   font-size: 50px; 
 } 

 h1:first-line { 
   font-size: 35px; 
 } 

According to Quirksmode兼容性非常好，特别是如果您在 ::first-line 语法上使用单冒号语法(所有优秀的浏览器都支持它，IE 5.5 及更高版本也支持)。

查看 jssfidle用于工作演示。