“CSS常用属性(二)”的版本间的差异
来自CloudWiki
第30行: | 第30行: | ||
|} | |} | ||
== 字体属性 == | == 字体属性 == | ||
+ | {| class="wikitable" | ||
+ | |- | ||
+ | ! CSS样式属性 !! 取值和描述 | ||
+ | |- | ||
+ | |font-family:字体集; ||系统支持的各种字体,彼此用逗号隔开 | ||
+ | |- | ||
+ | |font-size:字号大小; ||不同单位的绝对固定值(建议用pt)、%和em两个相对单位值、预定义取值。 | ||
+ | |- | ||
+ | |font-style:风格样式; ||normal常规、italic斜体、oblique偏斜体 | ||
+ | |- | ||
+ | |font-weight:粗细; ||normal常规、100~900、bold粗、bolder更粗 | ||
+ | |- | ||
+ | |} | ||
+ | *可以按以下顺序综合为字体设置属性: | ||
+ | font-style | ||
+ | font-variant | ||
+ | font-weight | ||
+ | font-size/line-height | ||
+ | font-family | ||
+ | |||
+ | *例如: | ||
+ | **font-family: arial, sans-serif; font-size: 30px; font-style: italic; font-weight: bold; | ||
+ | **等价于:font: italic bold 30px arial, sans-serif; — 注意顺序 | ||
+ | **使用综合设置时还可以在设置字号的同时设置行高,即在字号后加“/”再跟行高值。 | ||
== 文本属性 == | == 文本属性 == |
2017年10月15日 (日) 02:07的版本
相对单位和绝对单位
- HTML页面中的大小尺寸量度属性,一般都可以使用绝对单位值或相对单位值两种方式设置。
绝对单位
- 绝对单位的值就是用磅、像素、毫米等度量单位设置为固定数值。
- 如果使用像素px作为字号单位,则受显示器分辨率影响较大,因此,推荐使用计算机字体的标准单位pt
属性值单位 | 描述 | 属性值单位 | 描述 |
---|---|---|---|
px | 像素 | mm | 毫米 |
pt | 磅,1pt=1/72英寸 | cm | 厘米 |
pc | 皮卡,1pc=12 pt | in | 英寸 |
相对单位
- 块元素的宽度或高度使用相对取值单位时,就是相对浏览器或者父元素宽度或高度的百分比;
- 采用这种单位可随浏览器(或父元素)大小或者字号大小的变化而自动调整
属性值单位 | 描述 |
---|---|
em | 是当前字号大小的倍数,可根据字号的改变而自动调整。 |
ex | 是当前字号高度值的倍数 |
% | 适用区域大小或线条长度,一般是相对浏览器窗口或父元素同方向尺寸的百分比。如width:90%;, |
字体属性
CSS样式属性 | 取值和描述 |
---|---|
font-family:字体集; | 系统支持的各种字体,彼此用逗号隔开 |
font-size:字号大小; | 不同单位的绝对固定值(建议用pt)、%和em两个相对单位值、预定义取值。 |
font-style:风格样式; | normal常规、italic斜体、oblique偏斜体 |
font-weight:粗细; | normal常规、100~900、bold粗、bolder更粗 |
- 可以按以下顺序综合为字体设置属性:
font-style font-variant font-weight font-size/line-height font-family
- 例如:
- font-family: arial, sans-serif; font-size: 30px; font-style: italic; font-weight: bold;
- 等价于:font: italic bold 30px arial, sans-serif; — 注意顺序
- 使用综合设置时还可以在设置字号的同时设置行高,即在字号后加“/”再跟行高值。