“(3.6.2) -- 扩展阅读：CSS清除默认样式1”
在Web开发中，CSS（层叠样式表）是用于控制网页元素外观的关键工具。然而，不同的浏览器会为HTML元素添加自己的默认样式，这可能导致页面在不同浏览器中呈现不一致的效果。因此，清除默认样式是构建跨浏览器兼容网页的第一步。这段内容主要介绍了如何通过CSS代码来清除这些默认样式。
首先，提到的简化版清除代码是：
```css
* {
margin: 0;
padding: 0;
}
```
这个通配符选择器`*`应用于所有元素，设置它们的内外边距（margin和padding）为零，这是快速清除大部分元素默认边距的常见方法。然而，这种方法可能会对性能产生影响，因为它增加了CSS解析的时间。
为了更精确地控制和优化，可以使用更具体的元素选择器来清除特定元素的默认样式，如：
```css
/* 清除内外边距 */
body,
h1, h2, h3, h4, h5, h6, hr, p, blockquote,
dl, dt, dd, ul, ol, li,
pre,
fieldset, legend, button, input, textarea,
th, td {
margin: 0;
padding: 0;
}
```
这段代码分别针对结构元素、列表元素、文本格式元素、表单元素和表格元素进行了清除操作。
接着，设置默认字体是另一个重要步骤，确保在所有浏览器和编码环境下文本的统一性：
```css
body,
button, input, select, textarea {
font: 12px/1 Tahoma, Helvetica, Arial, "\5b8b\4f53", sans-serif;
}
```
这里设置了基础字体大小和行高，并指定了一系列备选字体，以适应不同的系统和语言环境，特别是对于中文，使用了ASCII字符`\5b8b\4f53`来表示“宋体”，确保在任何编码下都能正确显示。
此外，还对一些特殊元素的样式进行了重置，例如：
- 将斜体元素（如`address`, `cite`, `dfn`, `em`, `var`）的字体样式设为正常；
- 统一等宽字体，将`code`, `kbd`, `pre`, `samp`, `tt`元素的字体家族设置为“Courier New”等；
- 重置列表元素`ul`和`ol`的列表样式为无；
- 移除链接的下划线，但在鼠标悬停时恢复下划线效果；
- 对于带有`title`属性的`abbr`和`acronym`元素，修复了浏览器对它们的支持。
这样的CSS初始化样式表可以帮助开发者建立一个干净的起点，以便在之上添加自定义样式，从而实现一致且可控的网页布局。在实际项目中，还可以根据需要扩展或修改这些规则，以适应具体的设计需求和性能考虑。
我的内容管理
展开
