在HTML中，浏览器通常会为元素添加一些默认的样式，例如margin、padding等，这些默认样式可能会影响我们的网页布局和设计，为了确保我们的网页能够按照我们的预期来显示，我们需要去掉这些默认样式，以下是如何去掉HTML元素的默认样式的详细步骤：
（图片来源网络，侵删）
1、使用CSS Reset
CSS Reset是一种常用的方法，用于去掉HTML元素的默认样式，它通过设置一些基础的CSS属性，将元素的样式重置为一个已知的状态，这样，我们就可以在一个干净的环境中开始我们的样式设计。
下面是一个简单的CSS Reset的例子：
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
fontsize: 100%;
font: inherit;
verticalalign: baseline;
}
这段代码将所有元素的margin、padding和border都设置为0，fontsize设置为100%，并使字体继承父元素的字体，这样就可以去掉大部分默认样式。
2、使用normalize.css
除了自己写CSS Reset，我们也可以使用一些现成的库，例如normalize.css，这个库也是用来去掉默认样式的，但是它更加精细，只去掉了那些可能会引起问题的默认样式，而不是所有的默认样式。
使用normalize.css的方法很简单，只需要在HTML文件中引入这个库就可以了：
<link rel="stylesheet" type="text/css" href="https://necolas.github.io/normalize.css/8.0.1/normalize.css">
3、使用style属性
如果你只想去掉某一个特定元素的默认样式，你可以使用style属性直接在这个元素上设置样式，你想去掉一个段落的默认样式，你可以这样做：
<p style="margin: 0; padding: 0;">这是一个段落。</p>
这种方法的缺点是你必须为每一个需要去掉默认样式的元素都设置style属性，这会使HTML文件变得很臃肿。
去掉HTML元素的默认样式是一个很重要的过程，它可以使我们的网页更加符合我们的预期，我们可以通过使用CSS Reset、normalize.css或者style属性来达到这个目的。
本文来自投稿，不代表重蔚自留地立场，如若转载，请注明出处https://www.cwhello.com/439228.html
如有侵犯您的合法权益请发邮件951076433@qq.com联系删除
