web前端——html基础笔记 NO.10
浏览数：68 /
时间：2015年06月09日
CSS格式化排版
文字排版--字体
body{font-family:"宋体";}
body{font-family:"Microsoft Yahei";}
这里注意不要设置不常用的字体，因为如果用户本地电脑上如果没有安装你设置的字体，就会显示浏览器默认的字体。（因为用户是否可以看到你设置的字体样式取决于用户本地电脑上是否安装你设置的字体。）
现在一般网页喜欢设置“微软雅黑”
文字排版--字号、颜色
body{font-size:12px;color:#666}
文字排版--粗体
p span{font-weight:bold;}
文字排版--斜体
p a{font-style:italic;}
文字排版--下划线
p a{text-decoration:underline;}
文字排版--删除线
如果想在网页上设置删除线怎么办，这个样式在电商网站上常会见到：
上图中的原价上的删除线使用下面代码就可以实现：
.oldPrice{text-decoration:line-through;}
段落排版--缩进
中文文字中的段前习惯空两个文字的空白，这个特殊的样式可以用下面代码来实现：
p{text-indent:2em;} <p>1922年的春天，一个想要成名名叫尼克卡拉威（托比?马奎尔Tobey Maguire 饰）的作家，离开了美国中西部，来到了纽约。那是一个道德感渐失，爵士乐流行，走私为王，股票飞涨的时代。为了追寻他的美国梦，他搬入纽约附近一海湾居住。</p>
注意：2em的意思就是文字的2倍大小。
段落排版--行间距（行高）
行间距（行高）属性（line-height），如下代码实现设置段落行间距为1.5倍
p{line-height:1.5em;} <p>菲茨杰拉德，二十世纪美国文学巨擘之一，兼具作家和编剧双重身份。他以诗人的敏感和戏剧家的想象为"爵士乐时代"吟唱华丽挽歌，其诗人和梦想家的气质亦为那个奢靡年代的不二注解。</p>
段落排版--字间距、字母间距
文字间隔、字母间隔设置：
如果想在网页排版中设置文字间隔或者字母间隔就可以使用 letter-spacing来实现，如下面代码：
h1{ letter-spacing:50px; } ... <h1>了不起的盖茨比</h1>
注意：这个样式使用在英文单词时，是设置字母与字母之间的间距。
单词间距设置：
如果我想设置英文单词之间的间距呢？可以使用word-spacing来实现。如下代码：
h1{ word-spacing:50px; } ... <h1>welcome to imooc!</h1>
段落排版--对齐
以使用text-align样式代码，如下代码可实现文本居中显示
h1{ text-align:center; } <h1>了不起的盖茨比</h1>
同样可以设置居左：
h1{ text-align:left; } <h1>了不起的盖茨比</h1>
还可以设置居右：
h1{ text-align:right; } <h1>了不起的盖茨比</h1>
郑重声明：本站内容如果来自互联网及其他传播媒体，其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。
