默认样式、阴影、圆角

1、默认样式

默认样式：

           浏览器为了在页面中没有样式时，也可以有一个比较好的显示效果，

           所以为很多的元素都设置了一些默认的margin和padding，

           而它的这些默认样式，正常情况下我们是不需要使用的。

           所以我们往往在编写样式之前需要将浏览器中的默认的margin和padding统统的去掉

方法：

  1、清除浏览器的默认样式

* {
        margin: 0;
        /* 外边距为0 */

        padding: 0;
        /* 内边距为0 */

        list-style: none;
        /* 清楚列表项标记 */

        text-decoration: none;
        /* 无文本修饰 */
      }

2、引入重置样式表

重置样式表，专门用来对浏览器的样式进行重置

    注意：

    1、如果要引入重制样式表，前提必须要有这个css文件

     2、重制样式表必须在你写的样式之前引入

<link rel="stylesheet" href="./reset.css" />

2、设置阴影

box-shadow: 5px 5px 15px rgba(0, 0, 0, 0.5);

box-shadow

             用来设置元素的阴影效果，不会影响到页面布局

                第一个值：水平偏移量  正->右  负->左

                第二个值：垂直偏移量  正->下  负->上

                第三个值：模糊半径  可选  默认值0px

                第四个值：颜色   可选  默认值黑色

3、设置圆角

  (1）border-radius 用来设置圆角  以10px为半径画圆

（2）border-radius 后跟多个值，4个，3个，2个，1个

  (3)   border-radius: 50%;

  (4)    分别给每个角设置圆角

             borde-top-right-radius  （右上角）

             border-top-left-radius   （左上角）

             border-bottom-left-radius      （左下角）

             border-bottom-right-radius    （右下角）