7 - CSS

外连样式(推荐)

• html语法
• @import "style2.css";css语法

内连样式

• html语法 （一般放入里面）

---

选择器

1 基础选择器

• 基本选择器*：通用元素选择器
• 基本选择器#id：匹配特定的id
• 基本选择器.class：匹配class包括特定的元素
• 基本选择器elemengt：标签选择器

2 常见伪类选择器

a链接常用的写法
E:link 匹配所有未被点击的链接
E:visited 匹配所有已被点击链接
E:active 匹配鼠标已经其上按下的E元素
E:hover 匹配鼠标悬挂其上的E元素
E:nth-child(n) 匹配其父元素的第n个子元素，第一个编号为1
E:nth-last-child(n) 匹配其父元素的倒数第n个子元素，第一个编号为1
E:nth-of-type(n) 与E:nth-child(n)作用类似， 但是仅匹配适用同种标签的元素
E:nth-last-of-type(n) 与E:nth-last-child(n)作用类似， 但是仅匹配适用同种标签的元素

编写小技巧

image

HTML：

CSS：#header .logo{} #content .xxx{}

• {color:red}字体红色
• {border:1px solid:red}边框红色
• {font-size:30px}字体大小
• id与class区别？
  id定义的是页面上唯一的元素。class定义的是页面上某一类的元素。
• CSS注释
  /* 注释 */