元素显示模式转换

把行内元素转换为块元素
display: block
转换为行内元素
display: inline
转换为行内块元素
display: inline-block

---------------------------------
    a {
            width: 250px;
            height: 150px;
            background-color: orange;
            display: block;
        }

        div {
            width: 200px;
            height: 150px;
            background-color: purple;
            display: inline;
        }

        span {
            width: 150;
            height: 100;
            background-color: skyblue;
            display: inline-block;
        }

悬浮状态 必须严格按照要求 .选择器之间空格，a:hover没有空格

.nav .bg1:hover {
            background-image: url(aa.jpg);
        }

行高是字体的1.5倍

font:12px/1.5 "MicroSoft yahei"

权重

CSS有三个非常重要的三个特性∶层虽性、继承性、优先级。
继承或者* 0,0,0,0
类选择器，伪类选择器 0,0,1,0
ID选择器 0.1,0,0
行内样式 style="" 1,0,0,0
!important重要的 无穷大

继承

不管父元素权重多高，继承过来为0

复合选择器有权重叠加的问题
ul li =0 0 0 1 + 0 0 0 1
li = 0 0 0 1

image.png

盒子模型

 <!-- 盒子 容器 border边框 content内容 padding内边距 margin外边距 -->