已解决
CSS关于默认宽度
来自网友在路上 194894提问 提问时间：2023-11-08 22:21:30阅读次数： 94
最佳答案 问答题库948位专家为你答疑解惑
所谓的默认宽度，就是不设置width属性时，元素所呈现出来的宽度
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title></title><style>* {margin: 0;padding: 0;}.box {/* 设置了高度没有设置宽度 */height: 100px;background-color: red;}</style>
</head>
<body><div class="box"></div>
</body>
</html>
效果图：
如果我们设置了margin值
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title></title><style>* {margin: 0;padding: 0;}body {background-color: black;}.box {/* 设置了高度没有设置宽度 */height: 200px;margin: 100px;background-color: red;}</style>
</head>
<body><div class="box"></div>
</body>
</html>
效果图：
我们设置padding试一试
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title></title><style>* {margin: 0;padding: 0;}body {background-color: black;}.box {/* 设置了高度没有设置宽度 */height: 200px;padding: 0 100px;background-color: red;font-size: 20px;}</style>
</head>
<body><div class="box">11111111111111111111111111111111111111111111</div>
</body>
</html>
我们发现内容区被撑开了
小结一下：
总宽度 = 父的 content — 自身的左右margin
内容区的宽度 = 父的 content — 自身的左右margin — 自身的左右 border — 自身的左右padding
感谢大家的阅读，如有不对的地方，可以向我提出，感谢大家！
查看全文
99%的人还看了
相似问题
猜你感兴趣
版权申明
本文"CSS关于默认宽度"：http://eshow365.cn/6-35604-0.html 内容来自互联网，请自行判断内容的正确性。如有侵权请联系我们，立即删除！