为了账号安全,请及时绑定邮箱和手机立即绑定

为什么设置上下左右padding都一样时候内容不居中???

<!DOCTYPE HTML>

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312">

<title>填充</title>

<style type="text/css">

#box1{

    

    padding:10px 10px;

    border:1px solid red;

}

</style>

</head>

<body>

<div id="box1">盒子1def</div>

</body>

</html>


正在回答

2 回答

块级元素宽度是100%,独占一行,这里没指定div的宽度。而且padding是指内边距。

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

xiyou123

内边距不就是内容(盒子1)到border的距离吗??为什么不是10px呢? 既然设置了,就该一样啊??
2015-06-10 回复 有任何疑惑可以回复我~
#2

Perona 回复 xiyou123

是一样啊。不过盒子里面的内容并没有达到盒子的宽度和高度,所以没看出来。你可以用火狐调试下就知道了。而且边距默认是先设置上边和左边,这跟浏览器的渲染有关,浏览器的渲染是自上而下的。
2015-06-10 回复 有任何疑惑可以回复我~
#3

zning02 回复 Perona

为什么教程里面的盒子写好内容之后依然在同一行呢,不会居中
2015-08-06 回复 有任何疑惑可以回复我~
#4

Perona 回复 zning02

因为盒子里面的内容并没有达到盒子的宽度和高度。它先满足左内边距和上内边距。居中不是这样设置的。加油学吧,后面会学到居中滴~~
2015-08-06 回复 有任何疑惑可以回复我~
查看1条回复

举报

0/150
提交
取消

为什么设置上下左右padding都一样时候内容不居中???

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信