为什么我设置了padding：50px;而内容不是居中，边框不是正方形而是长方形？
来源：12-12 宰相肚里能撑船 - 使用padding为盒子设置内边距（填充）
稽小寞
2018-05-15 14:08
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>填充</title>
<style type="text/css">
#box1{
/*width:100px;
height:100px;*/
padding:50px;
border:1px solid red;
}
</style>
</head>
<body>
<div id="box1">盒子1</div>
</body>
</html>
写回答
关注
4回答
-
- 慕婉清2379718
- 2018-05-15 15:56:05
padding是内容距离左边框50px，因为你的内容太短了，所以看不出来离右边框多远，你多输入几十个字，看看效果就知道了。你把宽度和高度注释了，所以不是正方形，你把注释去掉再试一试。
/*width:100px;
height:100px;*/
-
- 慕勒1955161
- 2018-05-15 15:48:38
padding是内容和边框的距离,和你文字没关系。
-
- 飞上云端_
- 2018-05-15 14:58:00
内容居中用align，盒子的形状用width和height来控制，padding是内容和边框的距离
-
- 莫失
- 2018-05-15 14:49:52
容器居中（box1）：box1先绝对定位;left(或是right):50%;margin-left(right):-50xp(就是你容器的宽度的一半)；
或直接内容居中就行了（text-align: center;）
初识HTML(5)+CSS(3)-升级版
HTML(5)+CSS(3)基础教程8小时带领大家步步深入学习标签用法和意义
1225308 学习 · 18230 问题
相似问题