DIV+CSS网页基础布局

最新推荐文章于 2022-09-29 16:03:29 发布

dyj_121819

最新推荐文章于 2022-09-29 16:03:29 发布

阅读量1.4k

点赞数

分类专栏： HTML+CSS 文章标签： div

本文链接：https://blog.csdn.net/dyj_121819/article/details/78980036

版权

本文介绍了HTML布局中DIV+CSS的基础概念，包括ID和Class的使用原则，浮动方法及其在网页布局中的应用。通过示例详细讲解了如何使用ID和Class进行网页结构划分，并展示了不同类型的浮动效果，如left、right和clear属性的实践。同时，文章还探讨了网页常见布局结构，如广告区、导航区、主体区和版权区的实现，并演示了列表元素和导航条的CSS样式设计。最后，文章介绍了CSS定位方式，包括绝对定位、固定定位和相对定位，帮助读者掌握元素定位技巧。

摘要由CSDN通过智能技术生成

1）id的使用原则

Id具有唯一性，其使用原则也是依据这一特征建立的。Id是不能重复的，所以在h5结构中的大结构一定要用id，例如标志，导航，主体内容，版权。这些根据规范命名为#logo,#nav,#content,#copyright等，本着其唯一性的原则，建议定义id尽量在网页外的盒子中使用。

2）class的适用原则

Class在css的定义具有普遍性，即class可重复，无限制的使用多次，建议大家尽量在结构内部使用。有利于网站代码的后期维护与修改，让所有的class都成为id的子级或孙级。在写css的时候可以写成#father.child{...}。另外注意不要让class包含id，例如写成.father#child{...}就很不好。书写习惯建议。