                        课程
                    
                        /前端开发
                        
                            /HTML/CSS
                        
                        /初识HTML(5)+CSS(3)-升级版

填充问题padding

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

容器的长和宽是width和height，那内容“盒子1”的长度和宽度呢，怎样设置padding才能让盒子1到容器的中间啊

Flaur_

2016-02-27

源自：初识HTML(5)+CSS(3)-升级版 12-12

关注问题我要回答

655

操作

收起

3 回答

恭宽信
2016-02-29

设置行高line-height=盒子的高 text-align设置为居中

0 回复有任何疑惑可以回复我~

收起回答

smallzi
2016-02-27

<head>

<style>

#box1{

width:100px;

height:100px;

border:1px solid red;

text-align:center;

line-height:100px;(不需要设定padding值，设定text-align和line-height就可以实现“盒子1”在容器内水平垂直居中)

}

</style>

</head>

<body>

</body>

1 回复有任何疑惑可以回复我~

收起回答

流海侃人

请问下是为什么？为什么设置padding值会使红色边框变大呢？

2016-02-28 回复有任何疑惑可以回复我~

恭宽信回复流海侃人

如果你设置了盒子的宽和高 padding会将盒子撑大如果没没设置盒子的高和宽，而设置了盒子的父级标签的宽度 padding不会讲该盒子撑大，而只会压缩内容

2016-02-29 回复有任何疑惑可以回复我~

流海侃人回复恭宽信

明白了谢谢。

2016-03-03 回复有任何疑惑可以回复我~

luofs
2016-02-27

margin:0 auto;

0 回复有任何疑惑可以回复我~

收起回答

0/150

提交

取消

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

参与学习 1225763 人
解答问题 18233 个

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

进入课程

本课相似问答

3 回答填充padding

4 回答怎么设置填充padding颜色

5 回答盒子的高度比较大，所以设置填充padding为20px时，他只有上填充和左填充满足了吗？

3 回答填充内容位置问题

5 回答padding在盒子模型中可以设置填充颜色吗？

搜索更多本课相关问答

填充问题padding

我要回答关注问题

热搜

最近搜索清空

填充问题padding

3 回答

本课相似问答

填充问题padding