盒模型宽度和高度

盒模型宽度和高度和我们平常所说的物体的宽度和高度理解是不一样的,css内定义的宽(width)和高(height),指的是填充以里的内容范围。

因此一个元素实际宽度(盒子的宽度)=左边界+左边框+左填充+内容宽度+右填充+右边框+右边界。

QQ截图20161011160536.png


元素的高度也是同理。

比如:

css代码:

div{ width:200px; padding:20px; border:1px solid red; margin:10px; }

html代码:

 
文本内容

元素的实际长度为:10px+1px+20px+200px+20px+1px+10px=262px。在chrome浏览器下可查看元素盒模型,如下图:

QQ截图20161011160553.png

    宽度和高度  
  • 别让不会说话害了你
  • 二十七八岁就应该有的见识
  • 别让不好意思害了你


지속적인 학습
||
宽度和高度
  • 别让不会说话害了你
  • 二十七八岁就应该有的见识
  • 别让不好意思害了你
회사 소개 부인 성명 Sitemap
PHP 중국어 웹사이트:공공복지 온라인 PHP 교육,PHP 학습자의 빠른 성장을 도와주세요!