定的padding为10px，为什么感觉文字下面感觉比其他几面短些，来个神解释下
来源：12-12 宰相肚里能撑船 - 使用padding为盒子设置内边距（填充）
qq_曹振_0
2017-09-10 16:48
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>填充</title>
<style type="text/css">
#box1{
background:green;
width:100px;
height:100px;
padding:100px;
border:1px solid red;
</style>
</head>
<body>
<div id="box1">盒子1盒子盒子盒子盒子盒子盒子盒子盒子盒盒子盒子盒盒子盒子盒盒子盒子盒盒子盒子盒子盒</div>
</body>
</html>
写回答
关注
3回答
-
- 一只胡思乱想的猪
- 2017-09-11 15:48:27
其实是正常的,只是因为你的div设置的太小了,文字超出div的边界,图中最中间的蓝色小方块就是div区域,绿色区域是padding
或者你在div中加一个文本域就会显示正常了,代码如下:
<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <title>填充</title> <style type="text/css"> #box1{ background:green; width:100px; height:100px; padding:100px; border:1px solid red; } div textarea{ width:100%; height:100%; } </style> </head> <body> <div id="box1"><textarea width:100px;height:100px;>盒子1盒子盒子盒子盒子盒子盒子盒子盒子盒盒子盒子盒盒子盒子盒盒子盒子盒盒子盒子盒子盒盒子1盒子盒子盒子盒子盒子盒子盒子盒子盒盒子盒子盒盒子盒子盒盒子盒子盒盒子盒子盒子盒</textarea></div> </body> </html>
-
- 慕盖茨4351742
- 2017-09-10 20:02:52
1只占一个字符 每个汉字占2个字符 被挤下去了 你加一个text-align: center;就好了
-
- qq_Neverever_5
- 2017-09-10 19:52:41
text-align: center;
初识HTML(5)+CSS(3)-升级版
HTML(5)+CSS(3)基础教程8小时带领大家步步深入学习标签用法和意义
1225315 学习 · 18230 问题
相似问题