字体样式
字体样式是指对文本外观进行定制的属性,它决定了文本的呈现方式,包括字体的类型、大小、风格和粗细等。通过CSS(层叠样式表),可以使用不同的字体样式来改变页面内容的视觉效果,以提高可读性、层次感和美观度。
字体样式的概念及使用
-
font-family:设置字体类型
举例:font-family: "楷书"; -
font-size:设置字体大小(单位:px、em、rem、cm、mm、pt、pc)
举例:font-size: 12px; -
font-style:设置字体风格normal:默认标准italic:倾斜oblique:倾斜
举例:font-style: italic;
-
font-weight:设置字体的粗细normal:默认值,定义标准字体bold:粗体字体bolder:更粗的字体lighter:更细的字体100, 200, ..., 900(步长100):定义由细到粗的字体,400等同于normal,700等同于bold
举例:font-weight: bold;
-
font:在一个声明中设置所有字体属性
| 字体样式 | 描述 |
|---|---|
font-family | 设置文本的字体类型(如:"楷书")。 |
font-size | 设置文本的字体大小(单位:px、em、rem、cm)。 |
font-style | 设置字体风格(normal(默认标准)、italic(倾斜)和oblique(倾斜))。 |
font-weight | 设置文本的字体粗细(默认:normal;粗体:bold;更细:lighter;步长:400)。 |
foot | 风格(style)、粗细(weight)、大小(size)、类型(family)。 |
文本样式
文本样式指的是在网页设计中,用来设置和调整文本外观、布局以及呈现方式的CSS属性。通过文本样式,开发者可以控制文本的字体、颜色、对齐方式、间距等,以提高网页的可读性和视觉吸引力。
文本样式的概念及使用
-
color:设置文本颜色 -
text-align:设置元素水平对齐方式left:左对齐,默认值right:右对齐center:居中justify:实现两端对齐文本效果
-
vertical-align:设置元素垂直对齐方式top:顶部middle:中部bottom:底部
-
text-indent:设置首行文本的缩进(单位:px 或 em)
举例:text-indent: 20px; -
line-height:设置文本的行高(单位:px)
举例:line-height: 25px; -
text-decoration:设置文本的装饰none:默认值,定义的标准文本underline:设置文本的下划线overline:设置文本的上划线line-through:设置文本的删除线
| 文本样式 | 描述 |
|---|---|
color | 设置文本颜色 |
text-align | 设置元素水平对齐方式(左、右、居中、两端) |
vertical-align | 设置元素垂直对齐方式(顶部、中部、底部) |
text-indent | 设置首行文本的缩进(单位px或em) |
line-height | 设置文本的行高(单位px) |
text-decoration | 设置文本的装饰(下划线、上划线、删除线) |