填充内容位置问题

来源:12-12 宰相肚里能撑船 - 使用padding为盒子设置内边距(填充)

961005

2016-10-25 18:58

#box1{
    width:100px;
    height:100px;
    padding:10px;
    border:1px solid red;
}
</style>
</head>
<body>
<div id="box1">盒子1</div>

这段盒子不是应该在边框中间位置吗,因为上下左右填充是一样的。

写回答 关注

3回答

  • 南柯软件工程师
    2016-10-25 19:08:42
    已采纳

    padding是以内容为中心设置填充的宽高,width和height是块状元素的宽和高,它并不是以内容为中心的,内容再块状元素的左上角

    鱼牢里的鱼

    width和height在计算的时候不都是说它是内容的宽和高?块的真正宽和高是外边距+边框+填充+width/height?

    2016-11-11 20:43:08

    共 5 条回复 >

  • vihoppp
    2016-11-07 11:40:32

    padding 是填充盒子内内容区到盒子边框的距离,而文字只是在内容区内,光填充是不能使文字在盒子内居中的。

    还有文字是不能设置width、height的,内容区是可以自行设置的。

  • vihoppp
    2016-11-07 11:36:45

    text-align:center;

    height:100px;

    line-height:100px;

    (这样肯定能使文字在盒子内上下左右居中,height 和 line-height 要设置成一样的)

初识HTML(5)+CSS(3)-升级版

HTML(5)+CSS(3)基础教程8小时带领大家步步深入学习标签用法和意义

1225315 学习 · 18230 问题

查看课程

相似问题