行内样式: <p style="color:red"> 将style写在 元素p的后面 表示样式设置
color代表颜色 “:“ 冒号代表设置 red是什么颜色
内部样式: 在style中 声明如:
<style>
p { color:blue } P代表要设定属性的元素 将设定写在大括号内 然后用p元素写的内容就会变成
</style> 设定的颜色
外部样式表: 单独建立一个css文件 将p元素连样式写在css文件中,然后在xhtml中引用
引用:<link rel ="stylesheet" hyef="这里写链接的地址"> 应用写在 <style>中
选择器 : 指定的样式 规则作用于哪些元素 在大括号左边的就是选择器
声明块: 声明块就是大括号的开始结束包括的部分
声明: 用于告诉我们在浏览器上画出选择的元素 一个属性值和一个声明 用:分隔 ;号结束
属性: 属性是选择格式化元素的特征 每个声明只能有一个属性
属性值: 属性值是冒号后边 需要设定的 如果有空格 需要用双引号“” 括起来
选择器 (h1) h1{ (声明) color: blue ; margin-top lem } 声明块{}
p{ padding(属性):5px(属性值); }
h2{ background-color: #ddd; }
声明块分组:一个声明块内 可以有多个分组 每个分组必须以分号分开
p{padding: lem; padding:5px ; }
选择器分组: 当几个选择器共享相同的声明时 可以分组放在一起
h1,h2,h3{ padding: lem}
元素选择器: 匹配xhtml上任何元素 不考虑元素在什么位置
p就是一个元素 p{ padding(属性):5px(属性值); }
类选择器: 能选择某个具有class属性的 任何元素 不考虑位置 class可重复
.big{padding: lem} 这是类选择器
<p class="big"> 声明 p的class为 big
id选择器 以定义的id来选择 id是唯一的 所以只能定一个
.big{padding: lem} 这是id选择器
<p id="big"> 声明 p的id为 big
包含选择器: 选择在元素中的子元素
p h1{padding: lem} p代表p元素 h1 是p元素中的 子元素
<body>
<p>
<h1>我是子元素</h1>
</p>
</body>
通配符选择器: 通配符* 表示选择全部的元素
*{padding: lem} 所有元素都被设置属性了
伪元素选择器: first-line 用于元素第一行 first-letter 作用与第一个字母
p:first-line{padding: lem}
hover 鼠标在链接上触发
a : hover {color:greom text-decoration:none}
link 未激活触发
a : link {color:greom text-decoration:none}
active 鼠标点下 到放开时触发
a : active {color:greom text-decoration:none}
visited 已访问的触发
a : visited {color:greom text-decoration:none}