一旦为页面设置了恰当的 DTD，大多数浏览器都会按照上面的图示来呈现内容。然而 IE 5 和 6 的呈现却是不正确的。根据 W3C 的规范，元素内容占据的空间是由 width 属性设置的，而内容周围的 padding 和 border 值是另外计算的。不幸的是，IE5.X 和 6 在怪异模式中使用自己的非标准模型。这些浏览器的 width 属性不是内容的宽度，而是内容、内边距和边框的宽度的总和。

CSS盒子模型元素实际宽度的计算的更多相关文章

  1. css盒子模型之边框宽度，边框颜色与边框样式

    /* width和height只是设置盒子内容区的大小,而不是盒子的整个大小, 盒子可见框的大小由内容区,内边距和边框共同决定. */ .box1 { /* 设置内容区的宽度为400px */ wid ...

  2. [HTML/CSS]盒子模型，块级元素和行内元素

    目录 概述 盒子模型 块级元素 行内元素 可变元素 总结 概述 在div+css中,了解块级元素和行内元素还是非常有必要的,比如:对行内元素使用width属性就会失效.虽然自己不是做前端的,但是,在项 ...

  3. css盒子模型的宽度不包括margin

    看到教程上和一些博客上盒子模型的宽度 = content + padding + margin + border,应该是不包括margin的 <!DOCTYPE html> <htm ...

  4. css盒子模型的深入理解，在块级、行内元素的区别和特性

    css盒子模型用于处理元素的内容.内边距.边框和外边距的方式简称.元素框的最内部分是实际的内容,直接包围内容的是内边距.内边距呈现了元素的背景.内边距的边缘是边框.边框以外是外边距,外边距默认是透明的 ...

  5. 理解CSS盒子模型

    概述 网页设计中常听的属性名:内容(content).填充(padding).边框(border).边界(margin),CSS盒子模型都具备这些属性,也主要是这些属性. 这些属性我们可以把它转移到我 ...

  6. <转>HTML+CSS总结/深入理解CSS盒子模型

    原文地址:http://www.chinaz.com/design/2010/1229/151993.shtml 前言:前阵子在做一个项目时,在页面布局方面遇到了一点小问题,于是上stackoverf ...

  7. 聊聊css盒子模型

    css盒子模型原理: 在网页设计中常听的属性名:内容(content).填充/内边距(padding).边框(border).外边距(margin), CSS盒子模式都具备这些属性. 这些属性我们可以 ...

  8. 前端面试必备的css盒子模型

    今天同学发给了我一份前端基础的面试题,第一道便是对css盒子模型的理解,我看到的第一眼想到的是div,然后就...懵逼了,知其然不知其所以然.所以打算写一写盒子模型的概念理解啥的,如有写的不当的地方, ...

  9. {前端CSS} 语法 Css的几种引入方式 css选择器 选择器的优先级 CSS属性相关 背景属性 边框 CSS盒子模型 清除浮动 overflow溢出属性　　定位（position）z-index

    前端CSS CSS介绍 CSS(Cascading Style Sheet,层叠样式表)定义如何显示HTML元素,给HTML设置样式,让它更加美观. 当浏览器读到一个样式表,它就会按照这个样式表来对文 ...

随机推荐

  1. *HDU1829 并查集

    A Bug's Life Time Limit: 15000/5000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)Tot ...

  2. 下载php扩展笔记

    查找相关php的扩展网址https://pecl.php.net/index.php PECL 的全称是 The PHP Extension Community Library ,即PHP 扩展库.是 ...

  3. Swift微博编写感

    首先Swift是苹果2014年力推的编程语言.可见发展趋势  在此提供    

  4. ubuntu快捷复制粘贴

    今天使用putty,纠结复制粘贴的时候,才发现 原来只要选中文本后,就可以中键粘贴 整个桌面环境可用,新技能啊以前居然不知道

  5. final阶段成员贡献分

    项目名:连连看 组名:天天向上 组长:王森 组员:张政.张金生.林莉.胡丽娜 final阶段各组员的贡献分分配如下: 姓名 个人工作量 组长评价 个人评价 团队贡献总分 张政 11 7 6 6.00 ...

  6. canvas中的rotate的使用方法

    今天在绘制一个足球滚动的时候,想使用rotate方法,之前看到这个方法的时候,并没有引起任何重视,无非就是和CSS3里的rotate一样的用么... 遗憾的是,事实并非如此,由于代码在公司,我也就不去 ...

  7. mvc ef LINQ to Entities 不识别方法“Int32 Parse(System.String)”，因此该方法无法转换为存储表达式。

    private sys_User GetUserInfo() { sys_User model = null; var userId = Convert.ToInt32(AccountHelper.G ...

  8. PHP配置参数

    PHP使用到两个比较重要的配置文件: php.ini:决定php语言运行的环境,支持扩展的模块 , 开发环境的配置.(路径一般位于/etc/php.ini 或 /usr/local/php/etc/p ...

  9. Transferring Files to Your Instance with WinSCP

    WinSCP is a GUI-based file manager for Windows that allows you to upload and transfer files to a rem ...

  10. Windows一些零碎

    一.端口被占用: 1.netstat -ano |findstr 80 //查看3306端口是否存在 2.tasklist |findstr 3036(PID号)//查看pid为3036的是什么程序在 ...