盒模型--宽度和高度
来源：12-7 长胖长高点--宽度和高度
慕斯卡4106679
2016-01-08 12:55
盒模型宽度和高度和我们平常所说的物体的宽度和高度理解是不一样的，css内定义的宽（width）和高（height），指的是填充以里的内容范围。
因此一个元素实际宽度（盒子的宽度）=左边界+左边框+左填充+内容宽度+右填充+右边框+右边界。
为什么要算边界？关于盒子尺寸用在哪里？
写回答
关注
3回答
-
- 一杯茶的心情
- 2016-01-08 13:30:19
算边界个人觉得主要就是为了方便排版，盒子的尺寸计算在以后网页的美观方面可以起到很大的作用，让人看上去很舒服，整齐
-
- qq_马扎罗_0
- 2016-01-08 13:21:46
<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <title>填充</title> <style type="text/css"> #box1{ width:80px; height:80px; border:1px solid red; padding:10px; margin:100px; } </style> </head> <body> <div id="box1">盒子1</div> </body> </html>这是上图中的代码
-
- qq_马扎罗_0
- 2016-01-08 13:20:21
边界就是盒子里内容边框外部margin的宽度，我们看到的盒子只是盒子的一部分 边框外的margin是看不到的
下面就是例子中的盒子模型 在firefox浏览器 开发模式看到的 盒子的实际宽度
初识HTML(5)+CSS(3)-升级版
HTML(5)+CSS(3)基础教程8小时带领大家步步深入学习标签用法和意义
1225293 学习 · 18230 问题
相似问题