web前端基础-day4

内嵌式

• 直接写在标签里，使用style属性，只对当前标签有效。
• 页面内容和表现形式是高度耦合的，不利于分工合作。

<h1 style="color: aquamarine;">绝句</h1>

内部样式

• 内部样式是在head中部分使用 style标签，样式对当前页面有效。
• 内容和表现格式也实现了一定程度的分离，但不彻底。

外联式

• 需要一个link标签与css连接起来，内容和表现形式完全分离。
• 任何需要改样式的页面都可以通过link标签连接的方法实现。

class

<div class="poetry">

.poetry{
	text-align: center;
}

id

<p id="text1">两个黄鹂鸣翠柳</p>

#text1{
	color:darkgoldenrod;
}

字体相关属性

位置相关属性

text-align: center/left/right;
line-height（行高）：`normal/xx px`
letter-spacing（字符间距）：`2px/5px/xxxpx`
word-spacing（单词间距）：`normal/2px/5px/xxxpx`

大小相关属性

font-size: 50px;
font-weight： 100/200/normal(400)/bold(700)/bolder
font-variant： normal/small-caps（小写/大写）

类型相关属性

font-family `字体名称`
font-style `italic` / `normal` 是否倾斜 
color：代码/英文
text-decoration: none/overline/underline/line-through   正常/上划线/下划线/删除线
direction`方向`：`rtl` right to left  `ltr` 同上
text-transform:capitalize/uppercase/lowercase   首字母大写/全部大写/全部小写