CSS文件的开发踩坑(持续更新...)

最新推荐文章于 2025-03-10 15:02:14 发布

Noodlemes_csdn

最新推荐文章于 2025-03-10 15:02:14 发布

阅读量208

点赞数

文章标签： CSS

本文链接：https://blog.youkuaiyun.com/chenlintao_csdn/article/details/88917344

版权

本文介绍CSS样式设置中的常见问题及解决方案，包括如何清除默认内外边距、解决浮动元素引起的布局问题及利用display属性控制元素显示与隐藏的方法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

本篇文章主要用于记录在学习CSS样式文件中所遇到的坑。

在正式编写CSS样式表之前，通常习惯性的编写如下语句用于清除外边距和内边距。原因是：浏览器会在我们所编写的样式表之上默认的添加一定的外边距和内边距，一般在开发中我们都会将其清零，然后自己编写所需的内外边距。

*{
    margin: 0;
    padding: 0;
}

如果在编写CSS样式表时有使用到浮动属性，记得在结尾加上如下清除浮动的标签。原因是：由于使用了浮动语句，导致父级对象的盒子高度不能被撑开，即：出现了坍塌现象。而如果加上如下语句即可避免：

.clear{
    clear: both;
}

如果在标签的属性中加上如下语句: display: none;，则可以使得标签不在网页中进行显示。而如果在标签的属性中加上: display: block;，则可以使得标签可以在网页中正常显示。通常，我们通过在CSS样式表中为标签添加display: none;使得标签一开始处于隐藏状态，然后在JavaScript中获取标签的dom节点，并为标签添加上xxx.style.display = "block";从而自由的控制了标签的显示和隐藏。