HTML中实现段落首行缩进


中文习惯中,段落的首行总是要缩进两个字的,于是我天真的认为无论是英文还是中文,默认就应该这样做的。后来查看了几个国内外网站,发现原来大家都是没有首行缩进的,于是发现原来首行缩进也是中国人的“发明”。无论如何,既然查了,就要记录下来,虽然现在用不到,以后说不定能用到呢。

废话不多说,下面讲讲具体的方法。

最原始的方法,很简单,也很直接,就是在首行前加上空格:

<p>&nbsp;&nbsp;This is a paragraph.</p>

太山寨了?每个段落都要写,太麻烦了?–没事,条条大路通北京,我们还有其他方法(参考CSS text-indent 属性):

p {
    text-indent: 50px;
}

通过上述的CSS代码,我们设置了段落首行缩进50px,你可以根据实际情况设置不同的缩进值,还可以将单位“px”换成“cm”等其他长度单位。乍一眼看,似乎这样做就可以实现我们的目标了,但仔细一想,还是不对:中文中段落首行一般是缩进两个字,如果用长度单位,不还得根据字体大小来调整缩进?万一字体变了,那缩进的效果不就不同了?

放心,早有前人想到并且解决了这个问题了。我们可以这样做:

p {
    text-indent: 2em;
}

更多关于CSS中可用的单位,请移步CSS单位

Author: Rex Shen

Created: 2014-07-17 Thu 14:11

Emacs 24.3.1 (Org mode 8.2.7b)

Validate

Leave a comment

Your email address will not be published. Required fields are marked *