*{padding: 0;margin: 0;}的作用以及和ht

2020-02-01  本文已影响0人  CoderZb

*在html中表示的是所有标签,*{padding: 0;margin: 0;}中表示所有的标签的内外间距为0。因为有些标签会有默认的间距。写样式的时候,有这些默认的间距的存在,无疑会增加开发的复杂度。
以google浏览器为例,
body标签,默认的margin,上下左右各为8px
ul标签,默认的margin,左外间距为40px,(上右下是正常的,都为0px)
dl标签,默认的margin,上下各为16px,(左右是正常的,都为0px)
dd标签,默认的margin,左外间距为40px,(上右下是正常的,都为0px)
当然了不同浏览器的默认间距还可能会不一样,因此为了方便管理,可以在公共样式中写入*{padding: 0;margin: 0;},这样bodyuldldd的默认的padding和margin都重置为0了,既解决了不同浏览器的兼容性问题,也解决了默认的间距的存在,增加开发的复杂度的问题。

图1:body标签默认的margin,上下左右各为8px

image.png

图2:ul标签默认的margin,左外间距为40px,(上右下是正常的,都为0px)

image.png

图3:dl标签默认的margin,上下各为16px,(左右是正常的,都为0px)

image.png

图4:dd标签默认的margin,左外间距为40px,(上右下是正常的,都为0px)

image.png

相比于

*{
  padding: 0;
  margin: 0;
}

下面的html,body{padding: 0;margin: 0;}作用就少多了,表示清除浏览器的默认内外间距。

html,body{
  padding: 0;
  margin: 0;
}
上一篇下一篇

猜你喜欢

热点阅读