CSS

这是一篇关于CSS的思维导图，介绍了基础选择器、文字设置系统、CSS的引入方式、EMMET语法等，收藏下图了解吧！

CSS

• 基础选择器
  • 标签选择器
    • p{}
  • id选择器
    • #id {}
  • 类选择器
    • .类名 {}
  • 通配符选择器
    • * {}
• 文字设置系列
  • 字体属性设置
    • font设置字体系列
      • 字体设置
        • font-family
      • 字号大小设置
        • font-size
      • 字体粗细设置
        • font-weight
      • 字体样式设置
        • font-style
      • 字体复合属性设置
        • -font：font-style font-weght font-size font-family
          • 子主题
  • css 文本属性设置
    • 字体的颜色
      • color
        • 预定义的颜色值
        • 十六进制设置颜色值：#f0000
        • RGB颜色值
    • 装饰文本
      • text-decoration
        • none 默认 没有装饰线
        • underline 下划线
        • overline 上划线
        • line-through 删除线
    • 文本对其
      • text-align
        • center居中对齐
        • right 右对齐
        • left左对齐
    • 文本缩进
      • text-indent
        • 单位
          • px
          • em 是一个相对大小 ，根据当前元素单位来规定，1em是当前1个文字大小的距离
    • 行间距
      • line-height
• CSS的引入方式
  • 1.行内样式表
    • 定义：是在元素标签内部的Style属性中设置CSS样式
    • 特点：适合与修改简单样式
    • 语法： <p style="color:red">
  • 2.内部样式表
    • 内部样式表是写到html内部，是将所有的CSS代码抽取出来，单独放到一个<style>标签中
    • 特点：可以方便控制整个页面中的元素样式。
    • 子主题
  • 3，外部样式表
    • 特点：实际开发中最常见
    • 定义：样式单独写在CSS文件中，之后把CSS文件引入到HTML文件当中
    • 两步
      • 1.新建一个以.css为后缀的样式文件，把所有的CSS代码都放入此文件中
      • 2.在HTML页面中使用LINK标签引入CSS文件
        • <link rel="stylesheet" href="CSS文件路径">
• EMMET语法