css01小结-526互联

    <!-- 
        CSS的引入
        外链式        定义一个css文件，直接写  然后在head标签内用  link引入  <link rel="stylesheet" href="">
        内嵌式        head标签内  写style标签
        行内式        直接在标签内 写style定义，没有做到结构与样式分离 ，所以不用

        CSS 样式的功能
            1 尺寸类
                宽高 边框 内边距
            2 外观类
                文字(字体大小 字体 字体样式) 背景(背景图片 颜色 位置 背景大小)
            3 位置类
                外边距 定位 浮动

        CSS颜色色值相关设置
            rgb(红,绿,蓝)  0~255
            rgba(红,绿,蓝,透明度)  0~255   0~1   alpha
            #ffffff 十六进制   每两个字母代表  红 绿 蓝
        

        CSS的选择器
        通配符*   标签选择器  类    id  行内式   !important

        复合选择器
        交集  并集  子代  后代

        CSS的三大特性：
            层叠性  不同选择器，选择同一标签所设置的不同样式会共同作用在该标签上
            继承性  子标签会继承父标签的样式 2点  1.h标签继承父类的字体大小单位是em（通常不要这样设置）  2.a标签不继承字体颜色
            优先级   默认(body) < 通配符 <  标签 < 类  < id < 行内式 < !important





            
        选择器的权重叠加   继承的权重值为0


                标签选择器    类       id        行内式     !important 
                    0001     0010    0100        1000         ∞
     
        伪类选择器
            针对a标签的     :link普通链接状态  :visited点击后的状态   :hover鼠标悬停的状态  :action鼠标点击的状态
                            :focus  针对表单元素获取焦点时的状态
        

        行高的使用 line—height  行高 = 字体上边距 + 字体高度 + 字体下边距
    

        块级标签
        p div h1~h6 body table ul>li ol>li dl>dt dd html form
            特点；
                独占一行 可以设置宽高
        行内元素：
            span a  i/em u/ins b/strong s/del
            特点：
                可以在一行显示 不可以设置宽高
        行内块元素：
            input img
            特点：
                可以在一行显示还可以设置宽高\

        嵌套规则：
            块元素嵌套一切其他元素,注意p标签虽然是块元素标签，但是不要嵌套其他块标签
            行内元素和行内块互相嵌套，不要嵌套块级元素
        
        font-weight  字体粗细
        font-style  字体倾斜
        font-size  字体大小
        font-family  字体样式

        连写 最少写两个属性
        font:weight  style  size  family
        font:style  size  family
        font:size  family

        设置文本水平方向对齐方式
            text-align: center;
        文本垂直方方式用行高来设置  line-height

        设置文本是否有下划线 decoration（房屋内部的）装饰，装潢;装饰;装饰品;勋章;装饰图案;装饰风格
        text-decoration:none  表示取消
        text-decoration: underline 表示设置下划线
    -->