css font, text style attributes
This is mainly about CSS text properties: 字体样式属性and 文本样式属性.
First, the font style attributes
CSS font properties 字体设置(font-family)include: 字号大小(font-size), 字体粗细(font-weight), 字体风格(font-style), 字体颜色(color), .
1, set font (font-family)
Web page commonly used fonts are Arial, Microsoft elegant black, black body and so on, for example, the web page for all p tags to Microsoft elegant black font , you can use the following CSS style code:
p { font-family:"微软雅黑";}You can specify multiple fonts at the same time, in the middle to comma separated, he said that if the browser does not support the first font, it tries the next one, until you find the right font.
p {font-family:"微软雅黑",“宋体”，arial;}note
1, English fonts require double quotes, such as: the selector {font-family: arial;}
2 as comprising a special symbol font must be enclosed in double quotes, such as: the selector {font-family: "Microsoft yahei";}
3, try to use the system default font, to ensure that any user can display correctly in the browser.
2, font size (font-size)
p {font-size:15px;}The value of this attribute may be used relative to the length of the unit, the absolute length units may also be used. More commonly, the relative length of a pixel unit recommended px.
Suggest
1, pages generally use more than 14px font size font size
2, try using a dual number, because ie6 under singular circumstances such as older browsers may bug out
3, font weight (font-weight)
p {font-weight:bold;}In addition to using bold font b and strong tags, you can use CSS to achieve, but CSS is not semantics.
属性值
bold：字体加粗 ( 700：等于bold，如果还想更粗就加大数值)
normal：字体正常 ( 400：等于normal，如果还想更细就减小数值)4, font style (font-style)
p {font-style:normal;}In addition to italic by i and em tags may be implemented using CSS, but there is no semantic CSS.
属性值
normal：默认值，浏览器会显示标准的字体样式。
italic：浏览器会显示斜体的字体样式。Usually we rarely give italic text, but like to italic tag (em, i) changed to the normal mode.
5, text color (color)
color defines the color of text, which embodiment has the following three values:
1.预定义的颜色值: 如red，green，blue等。
2.十六进制: 如#FF0000，#FF6600，#29D794等。（常用)。
3.RGB代码: 如红色可以表示为rgb(255,0,0)或rgb(100%,0%,0%)。6, a comprehensive set font style (fort)
After learned several properties above if we find these styles have a label set, then it will be very complicated to write the code redundancy too, let's learn some simple set up.
The basic syntax
选择器{font: font-style font-weight font-size/line-height font-family;}注意
1, the use font attributes, must be sequentially written in the above syntax, the order can not be replaced , each separated by a space attributes.
2, where the attribute need not be provided may be omitted (the default value), but must retain the font-size , and font-family properties, font properties will not work otherwise.
Examples
<!DOCTYPE html>
<html>
<head>
<title>Document</title>
<style>
p {
font: italic 20px "微软雅黑";
}
</style>
</head>
<body>
<p>字体连写是有顺序的</p> <!-- 字体分格倾斜 大小20px 微软雅黑 -->
</body>
</html>Second, the text style attributes
CSS appearance properties 行间距(line-height)include: 水平对齐方式(text-align), 首行缩进(text-indent), ,文本的装饰(text-decoration)
1, line spacing (line-height)
p {line-height: 15px;}line-height attribute is used to set the line spacing is the distance between the line and the line, i.e. the vertical spacing of characters, generally referred to as the row height. Under normal circumstances, the line spacing is larger than the size 7.8 pixels around it.
2, text-align: horizontal alignment
p {text-align: center;}Level text-align property is used to set the alignment of the text content, corresponding to align the alignment properties html.
属性值
left：左对齐（默认值）
right：右对齐
center：居中对齐Note: This tab will only block-level elements or table elements centered, to properly set the left on these elements by right margins to achieve.
3, text-indent: first line indent
p {text-indent: 2em;}text-indent property used to set the first line of text indent, 1em is the width of a word, if a paragraph of Chinese characters, 1em is a character width
4, decorative text-decoration text
text-decoration commonly used to modify our decorative effect to the link
5, summary
Here we talked about here for a summary to do
reference
More can be seen w3school official document: w3school-CSS Tutorial
你如果愿意有所作为，就必须有始有终。(4)