1、9清除内外边距

最新推荐文章于 2025-04-10 04:44:24 发布

这一片月

最新推荐文章于 2025-04-10 04:44:24 发布

阅读量1.6k

点赞数

分类专栏： css样式

本文链接：https://blog.youkuaiyun.com/qq_62865634/article/details/127475791

版权

CSS 内外边距清除浏览器兼容性布局

关键词由优快云通过智能技术生成

css样式专栏收录该内容

41 篇文章

订阅专栏

本文介绍了如何通过CSS清除网页中各元素的默认内外边距，以达到页面布局的一致性。使用全选择器`*`设置所有元素的`padding`和`margin`为`0`，解决不同浏览器间的差异问题。同时提醒注意行内元素的边距设置，并提供了代码示例加以说明。

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

提示：文章写完后，注意到网页很多自带默认内外边距，而且不同浏览器默认值不一样，首先清除。

1、语法：

padding:"0";

margin:"0";

}

解释：

“*”表示全部选择，清除内外边距，padding表示内边距、margin表示外边距。

注意：

行内元素为了兼容，尽量只设置左右边距，不要设置上下边距，但是块级转化行内元素可以。

自己代码展示：

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>清除内外边距、在每一个标签它的内外边距不一样</title>
    <style>
        /* 我们直接用全选择器来设置所以的标签设置内外边距为0 */
        
        * {
            /* 这个※表示全选择器 */
            padding: 0;
            /* 把内边距设置为0 */
            margin: 0;
            /* 把外边距设置为0 */
        }
    </style>
</head>

<body>
    123
    <ul>
        <li>123</li>
    </ul>

</body>

</html>