李洋学习笔记-css-day01

CSS

• 选择器

  • 类选择器 .class{}
  • id选择器 #id{}
  • 标签选择器 div{}
  • 属性选择器 input[type='text'] {}
  • 后代选择器 div h1 {}
  • 子选择器 div>h1 {}
  • 相邻选择器 li+li{}
  • 伪类选择器 a:hover{} 、div:after{}

• 权重

  • !important（最高）
  • 内联样式（权值为1000）
  • ID选择器（权值为100）
  • 类选择器（权值为10）
  • 标签选择器（权值为1）
  • 后代选择器（权值叠加 .class1 div{} 10+1）

• 布局

  • 定位（position）
    • 绝对定位 absolute
    • 相对定位 relative
    • 固定定位 fixed
    • 默认定位 static
  • 浮动 （float）
    • 左浮动float：left
    • 清除浮动 clear：both

• 盒子模型

  • 基本属性
    • 内容(content)
    • 填充(padding)
    • 边框(border)
    • 边界(margin)
  • 模式
    • 标准盒模型 (box-sizing:content-box) 默认模式
    • 怪异盒模型 (box-sizing:border-box) width=contentWidth +padding +border
• CSS3新特性
  实现圆角（border-radius），阴影（box-shadow），对文字加特效（text-shadow、），线性渐变 (gradient) 动画(transform) 过度(transition) 多列(column-)

补充CSS3部分，也需要分类