fang
* 定义在 * 在文档头引入 ==== css样式 ==== ==== 基本样式 ==== * p {color:red;} * h1, h2, h3 {color:red;} * article p {color:blue;} * span > h1{color:blueviolet;} * h2 + p {color:red;} * h2 ~ a {color:red;} * h2 * {color:blue;} * .specialtext {font-style:italic;} ==== 类选择符 ==== * .fang{color:blue} # 类选择符 * .qiang{font-size:420%;} # 类选择符 * .fang.qiang{background: red} # 对同时选择 fang qiang的类生效 * p.fang{background: yellow} # 对使用fang类的p标签生效 ==== id选择符 ==== * 示例：#.aaa{color:blue} * id选择符，跟类选择符用法一样 * id选择符并多了一个页面内跳转的功能 * id选择符自能使用一次，类选择符可以被多次使用 ==== 属性名选择符 ==== * 标签名[属性名] * img[title] {border:2px solid blue;} ==== 属性值选择符 ==== * 标签名[属性名="属性值"] * img[title="red flower"] {border:4px solid green;} ==== 伪类 ==== * a:link {color:black;} 链接就在那儿等着用户点击 * a:visited {color:gray;} 用户此前点击过这个链接。 * a:hover {text-decoration:none;} 鼠标指针正悬停在链接上。 * a:active {color:red;} 链接正在被点击(鼠标在元素上按下,还没有释放) * p:focus{color:red;} # 当p标签获得焦点时出发，focus能被所有标签使用 * #tar:target {background:#000;} #当页内跳转时，跳转到的地方背景变成黑色to tar === 结构化伪类 === li:first-child {color:blue;} # li标签的第一个元素 li:nth-child(2) {color:blue;}# li标签的第二个元素 li:last-child {color:blue;} # li标签的最后第一个元素 ==== 伪元素 ==== * p.age::before {content:"Age: ";} * p.age::after {content:" years.";} *25
* 结果：Age: 25 years. * p::first-letter {font-size:300%;} 段落首字符加大 * p::first-line{font-size:300%;} 段落首行字体加大 ==== html引用样式 ==== *fang
# 同时选择多个类，空格分开 * to tar 页面内跳转，跳转到aaa 标签 *fang
* to tar 页面内跳转，return to top ==== 其他说明 ==== *