CSS

 目录

1. 介绍css

2. CSS语法

3. CSS注释

4. CSS中的颜色值

5. CSS长度单位

6. html引入CSS的三种方法

    6.1 行内样式（内联样式）

    6.2   内嵌样式

    6.3 外部样式

7. 选择器

    7.1 标签选择器

    7.2 类选择器

    7.3 ID选择器

    7.4 通配所有元素

    7.5 分组选择器

    7.6 选择器的优先级

    7.8选择器的权重

    7.9  最⾼权重

    7.10 css三⼤特性

          7.10.1 层叠性

         7.10.2 继承性

         7.10.3 优先级

8.字体的样式

9. 字体的粗细

10. 文本的字体

11. 行高

12. 外部引入

13. 合并

1. 介绍

 CSS是Cascading Style Sheets的英文缩写,即层叠样式表

 Html【Hyper Text Markup Language】

   CSS语言是一种标记语言,因此不需要编译,可以直接由浏览器执行(属于浏览器解释型语言).

   CSS是用于布局与美化网页的

   CSS能实现内容与样式的分离，方便团队开发

   CSS是由W3C的CSS工作组产生和维护的

2. CSS语法

CSS 由选择器、属性、属性值组成

 3.css注释

/*     */ 

快捷键ctrl +/

4.css的颜色值

  4.1 用英文字母表示

   4.2 用十六进制表示(0~f)

   从1到9用数字 10到15用英文字母从a开始

       用6位表示颜色 

       用3位表示颜色

      4.3用rgb表示颜色(0~255)

r表示红色  g表示绿色 b表示蓝色

      4.4 用rgba表示颜色

      a表示 透明度  0 代表完全透明  1代表不透明  0.5 代表半透明

       r表示红色  g表示绿色 b表示蓝色

  5.css长度单位

   5.1 像素单位px

        宽为100px

     5.2 百分比尺寸

     宽为50% 占父元素的50% 以父元素为参照   没有父元素 就以祖先为参照

       5,.3 em 倍数

       宽为1倍  以父元素为参照  

      5.4 rem 根倍数

    以html为参照   宽为1倍的HTML

6.css的引入方式

    6.1 行内样式（内联样式）

    行内样式权重最大

   6.2   内嵌样式

    把css样式写入style 

  此内嵌方式比行内样式权重低一些

   6.3 外部样式

  要先创建一个css文件 把样式写到css文件里面 然后用link进行外部引入

  此引入的权重比内嵌样式低

    6.4  引入的优先级

   行内样式>内嵌样式>外部样式

   实现就近原则

 7.选择器

    7.1 标签选择器

     以标签名为开头的是标签选择器

    7.2 类选择器

     以.开头的是类选择器

    7.3 ID选择器

     以#开头的为ID选择器

    7.4 通配所有元素

     *是统配符  整个页面都可以使用 也是权重最低的

    7.5 分组选择器

    表示在同一个等级时可以用分组选择器

    标签与标签之间用逗号隔开

    7.6 选择器的优先级

    行内> id选择器>类选择器>标签选择器>统配选择器

    7.8选择器的权重

　　行内 权重为1000

       id 选择器为100 

       类选择器伪类和属性选择器为10

       标签选择器伪类和属性选择器为1

       统配选择器为0

    7.9 最⾼权重   

     !important 重要的

    7.10 css三⼤特性

          7.10.1 层叠性

         所谓层叠性是指多种CSS样式的叠加

         层叠性是浏览器处理冲突的⼀个能⼒,如果⼀个属性通过两个相同选择器设置到同⼀个元素上，那么这个时候⼀个属性就会将另⼀个属性层叠掉（覆盖）

         样式不冲突，不会层叠

         样式冲突；就会层叠； 按照优先级，决定哪个样式⽣效

         7.10.2 继承性

          CSS 的继承特性指的是应⽤在⼀个标签上的⼀些 CSS 属性被传到其⼦标签上；就是被⼦标签继承

          不是所有的样式都会被⼦标签继承， 字体类font- ; ⽂本类 text- ； 颜⾊color ； ⾏⾼line-height 等可以被继承

          a标签⽐较特殊，没有办法通过继承改变a标签的字体颜⾊

         7.10.3 优先级

           权重的优先级，决定哪个样式最终⽣效

            权重相同： 后者⽣效； 权重不同： 权重⾼者⽣效

8.字体的样式

font-style:"normal" 正常

font-style:"italic"斜体

 9.字体的粗细

font-weight:"bold/bolder"; bold是粗体 

font-weight:400;

400, 500为正常

500<为粗体

>400为细体

 10.文本的字体

font-family 可以自己外部引入字体

 11.行高

line-height:200px 

使文本垂直居中

 12.外部引入

@font-face{}

自己设置一个字体名字 liu

src:url() 然后引入你所下载的文字样式

最后使用你所设置的文字名称

 13. 合并font

 

font：<font-style> <font-weight> <font-size>/<line-height> <fon-family>

必须是大于2个样式以上才能够被渲染.