CSS语法

一、CSS书写方式

    1、内嵌式写法；2、外嵌式写法；3、行内式写法

二、CSS语法格式

     1、选择器{属性: 值;    属性:值;......}

           选择器：选择（html标签，如：p标签，h标签，a标签）

                  简单选择器：标签选择器；类选择器（使用最多）；ID选择器；通配符选择器

                  复合选择器：后代选择器（使用最多）；并集选择器；标签指定式选择器（交集选择器）

            属性：

                   background-color  背景颜色；color   前景色（文字颜色）；font-size:20px   设置文字大小；width:20px;   设置宽度

                   height:20px;   设置高度；

      2、标签选择器

            注意：标签选择器，必须是html标签

            标签名：{属性: 值;......}

            

      div{            color: brown;            font-size: 30px;            width: 200px;            height: 200px;            background-color: aquamarine;        }

              单位：px：像素；em：一个文字的大小1em。

              颜色表示方式：1、直接设置颜色对应的单词；2、十六进制设置；3、以RGB的方式设置；4、RGBA()：a：alpha 0--1；5、opacity：半透明效果

             

        3、类选择器（class）

              语法：

                      .自定义类名{属性: 值; 属性:值;...}；类名不能以数字开头或纯数字，也不能以特殊字符开头

               类选择器调用：

                      html标签通过class属性调动类样式；一个类样式可以被多个标签同时调用；一个标签可以同时调用多个样式

        /*类选择器的定义*/        .public{            color: blue;        }

         4、ID选择器

             语法：#自定义名称{属性: 值}

             调用：标签可通过ID属性调用

             ID选择器与类选择器之间的区别：
                 ◆一个ID样式只能被一个标签调用（身份证）
                 ◆一个标签只能调用一个ID样式

         5、通配符选择器

              语法：
                      *{属性： 值;....}

              特点：将页面中所有的标签都选中，设置样式。

      

         6、font属性

               ☞font-size    设置文字大小
               ☞font-weight   设置文字加粗显示

               ☞font-style    设置文字斜体
                      ◆normal  默认为正常显示
                      ◆italic    文字斜体

               ☞font-family   设置文字字体
                      ◆直接设置字体名称

                      ◆ 设置字体对应的单词

               ◆line-height    设置文字的行高
                                 注意：
                                    ☞该属性只对文字起作用。   

        7、font属性连写

              语法： font:font-style font-weightfont-size/line-height font-family             

             ◆在font属性联写中，font-size必须在font-family前面。

             ◆font属性联写中，必须有font-size 和font-family的值。
             ◆font属性联写中，如果属性都设置，那么按照 font:font-stylefont-weight font-size/line-height font-family 顺序写。

        8、后代选择器

              语法：
                 选择器  选择器{属性: 值；}

              注意：
                      ◆后代选择器，标签之间必须是嵌套关系
                      ◆后代选择器，选择器与选择器之间必须有空格隔开。
                      ◆后代选择器只能改变子元素中的样式。

   

         9、标签指定式选择器

               语法：
                 标签名.类名{属性: 值;}
               标签之间的关系：
                 ◆标签之间属于既.....又...的关系（指的是同一个标签）

   

          10、并集选择器

               语法：选择器,选择器{属性:值;...}

               注意：
                 ◆并集选择器，标签之间可以是嵌套关系可以是并列关系。