什么叫默认样式

默认样式

通常情况下,浏览器都会为元素设置一些默认样式。

默认样式的存在会影响到页面的布局,通常情况下,我们编写网页时,必须要去掉浏览器的默认样式(主要是pc端的页面,移动端的页面比较少)

示例:body会有一个8px的边框,会影响到我们页面的布局

     <style>

              .box1{

                        width:100px;

                         height:100px;

                        border:1px  solid   black;

                       }

        </style>

<body>

<div  class=“box1”></div>

<p>秦时明月汉时关</p>

<p>万里长征人未还</p>

<p>但使龙城飞将在</p>

<ul>

    <li>列表项1</li>

    <li>列表项2</li>

    <li>列表项3</li>

</ul>

</body>

通常情况下不会这样写,但更加严谨

1.如何去掉body的8px的边框【只需在style里添加一个margin就可以了】

2.如何去掉body里p元素的边框

【在style里添加一个margin就可以了】

3如何去掉body里ul的边框

【在style里添加margin和padding还有一个

list-style】

 

示例:

       <style>

                 body{

                         margin:0;        【1在此处添加】

                          }

                 p{

                    margin:0;             【2在此处添加】

                    }

                 ul{

                     margin:0;            【3在此处添加】

                     padding:0;          【3在此处添加】

                     list-style:none;   【3在此处添加】

                    }

                .box1{

                        width:100px;

                         height:100px;

                        border:1px  solid   black;

                       }

         </style>

<body>

<div  class=“box1”></div>

<p>秦时明月汉时关</p>

<p>万里长征人未还</p>

<p>但使龙城飞将在</p>

<ul>

    <li>列表项1</li>

    <li>列表项2</li>

    <li>列表项3</li>

</ul>

</body>

 

list-style:none;(去除项目符号)

list-style列表风格

上述最简单的方法

但还会有残留,严谨一点还是用上边的方法

*{

   margin:0;

   padding:0;

  }

有ul再单独去掉

 

 

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

reset.css直接去除了浏览器的默认样式

nomalize.css对默认样式进行了统一

二选一

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值