HTML标签及CSS公用样式实战总结

"HTML标签大全与CSS公用样式解析" 在网页设计和开发中，HTML（超文本标记语言）和CSS（层叠样式表）是构建页面布局和样式的基石。本资源主要涵盖了HTML的各种标签以及一些CSS开发中的常用公用样式和解决方案。 首先，HTML标签是构成网页的基本元素，它们定义了页面内容的结构和意义。以下是一些常见的HTML标签： 1. `html`: 定义整个HTML文档。 2. `body`: 包含网页的所有内容。 3. `div`: 通用容器标签，用于分组其他元素。 4. `p`: 定义段落。 5. `ul` 和 `li`: 用于创建无序列表。 6. `ol` 和 `li`: 创建有序列表。 7. `dl`, `dt`, `dd`: 用于定义定义列表。 8. `h1` 至 `h6`: 表示不同级别的标题。 9. `form`: 用于创建表单。 10. `input`, `select`, `button`, `textarea`: 表单元素，用于用户输入和交互。 11. `iframe`: 允许在页面中嵌入另一个完整的页面。 12. `table`, `th`, `td`: 用于创建表格。 接下来，我们来看一些CSS公用样式，这些样式通常被应用于整个页面以实现基本的样式统一： 1. `margin: 0; padding: 0;`: 重置所有元素的内外边距，避免默认样式的影响。 2. `img{border: 0 none; vertical-align: top;}`: 图片无边框，且垂直对齐方式设为顶部。 3. `ul, li{list-style-type: none;}`: 取消列表项符号。 4. `h1` 至 `h6` 的字体大小设定，确保标题层次清晰。 5. `body, input, select, button, textarea`: 设置全局的字体大小和字体族。 6. `button{cursor: pointer;}`: 将按钮鼠标悬停时的光标设为指针形状，表明可点击。 7. `i, em, cite{font-style: normal;}`: 将这三种元素的字体样式设为正常，避免默认的斜体效果。 8. `body`: 设置背景色、文本颜色、行高等基本样式。 9. `a`: 设置链接的默认颜色、无下划线，以及鼠标悬停和激活状态的样式。 10. `.fixed`: 清除浮动，用于创建浮动元素后的布局恢复。 11. `.clear`: 清除浮动，确保内容不被浮动元素影响。 12. `.more`: 通常用于定义右浮动的“更多”链接。 此外，这个资源还提到了一些CSS解决方案，例如，使用`:after`伪元素和`clear:both`来解决浮动元素引起的布局问题，以及使用`*html` hack来处理早期IE浏览器的兼容性问题。 以上内容是HTML标签的基础介绍和CSS公用样式的一个简要概述，实际开发中，开发者还需要根据项目需求和浏览器兼容性进行更深入的定制和优化。掌握这些基础，可以为创建整洁、高效的网页打下坚实的基础。