鉴于此:
<h1>This is a test <small>It is</small></h1>
是否有任何可以应用于<small>
的CSS,它会出现在BEFORE之前,在上一行之前,在“这是......”之前? float:left; display:block;
在内容之前没有得到它。
答案 0 :(得分:1)
在这种相对简单的情况下,您可以使用定位。将标题声明为相对定位,在其上设置合适的顶部填充,并使small
元素“绝对”定位(即,相对于其定位的祖先,标题定位)。例如:
h1 { position: relative; padding-top: 1em; }
h1 small { position: absolute; top: 0; left: 0; height: 1.3em; }
请注意,在设置填充时,em
表示h1
元素的字体大小,而在声明内部元素的高度时,small
元素,{{1} }表示其字体大小,它更小。因此,em
与1em
相对应,即使填充意图为1.3em
元素提供空间。您可能希望在small
和h1
(例如small
)上设置字体大小以获得更可预测的呈现效果,然后尝试使用h1 { font-size: 150% } small { font-size: 80% }
和padding
获得你喜欢的外观的价值观。此调整还取决于字体。
答案 1 :(得分:0)
这是:
HTML:
<h1 id="thisid">This is a test <small>It is</small></h1>
CSS:
#thisid:before {
content:"This is the content on the line above \A ";
white-space: pre;
}
之前的伪元素将使之前的东西。而\A
将使空间中断。