标题和段落文字大小以及排版设计
** 标题和段落字体大小 **:本文我们讨论使用em来设置标题和段落字体大小,并且相关排版的设计
这一类的排版建议把标题设置为默认字体大小的1.125em,也即1.125倍,而正文字体为0.75em,line-height为相对正文字体大小的1.5em(注意不是相对默认字体16px设定,是相对正文字体大小设定),建议再设置标题块(如h1)和段落块(如p)的margin同为相对正文字体大小的1.5em。下面我们写出具体代码以及解释
假设默认字体大小为16px(事实也确实如此)
1 | <div class="container"> |
1
2
3
4
5
6
7
8
9
10
11
12
13
/*基本css样式设置*/
html {
font-size: 100%;/*为了兼容IE*/
}
body {
font-size: 1em;
}
.container {
width: 46.25em; /*740px/16px=46.25em*/
margin: 1.5em auto
border : 0.0625em solid #ccc /*1px/16px=0.0625em*/
}
1 | /*基本css样式设置*/ |
给标题设置样式:“18px”的字体,“18px”的行高以及margin值
1 | h1 { |
给标题设置样式:“12px”的字体,“18px”的行高以及margin值
1 | p { |