css样式

css样式reset

不同浏览器的默认样式不一样。

这对开发有着影响，所以需要通过reset去覆盖浏览器默认样式。

reset作用只是覆盖吗？

我们也可以通过reset去定义全局的样式，比如网页背景色，字体、字体大小等等。

 

css水平居中：

有几种方式：

    <div class="parent">
        <div class="child">111</div>
    </div>

1：flex 布局：父元素：display:flex;+justify-content:center，主轴方向上居中显示

2：flex 布局：父元素：display:flex;子元素magrin:0 auto; 

3 absolute+transfrom  父元素：position:relative; 子元素：position：absolute; left:50%;transfrom:translateX(-50%);

4inline-block text-align 父元素text-align:center;子元素：display:inline-block;

css垂直居中：

1：absolute+transfrom  父元素：position:relative; 子元素：position：absolute; top:50%;transfrom:translateY(-50%);

2：flex 布局：父元素：display:flex;+align-items:center，交叉轴方向上居中显示

css水平垂直居中：

1 absolute+transfrom  父元素：position:relative; 子元素：position：absolute; left:50%;transfrom:translate(-50%，-50%);

2：flex 布局：父元素：display:flex;+align-items:center；justify-content:center交叉轴方向上居中显示

3 如果子元素宽度固定，可以用子元素absolute。right，left，top，bottom为0，margin：auto；来居中；