block 和 inline 的区别是？（2）
作者：棕熊 来源：棕熊@Think Fast 发布时间：2009-12-08 13:00:00
- Block Box VS Inline Box
大家应该对CSS的盒式模型有些了解了吧。网页上内容的布局，都是靠controlling box来实现的。
在CSS2.1的规范里，Controlling box 分三类——block box, inline box, 和至今都没怎么被广泛支持的run-in box。这就是规范中第二处提到block 和inline 的地方。网页上的内容，不论是不是有标签包围，或者设定了何种显示方式，最终都会被计算成一个 controlling box，并应用布局规则。
好在这个过程对于前端开发来说是透明的，大家可以不用去考虑，而只要考虑这两种盒的区别就行了 
在普通布局中，block box 是从上至下，一个隔一个的布局的；inline box 则是从左至右（也可能因为设置了direction而从右到左，或者从上到下）首尾相接，不间断的布局的。
inline box 不响应垂直margin, width, height, max/min width/height 等属性声明；block box 则可以响应这些属性。
常用的基本上就这样了。
- display: block VS display: inline
最后一个有提到block 和inline 的地方就是这里了。和其他两个地方不同，block 和inline 并不是display 这个属性的唯一取值。CSS2.1规范中，display 属性的取值可以为以下的任何一个：inline, block, list-item, run-in, inline-block, table, inline-table, table-row-group, table-header-group, table-footer-group, table-row, table-column-group, table-column, table-cell, table-caption, none, inherit。
在通常情况下，display: block 能让元素生成一个block box, 而display: inline 会生成inline box。至于两者的区别请见上一节 
- 最后大家有兴趣的话
可以思考一下LI 元素到底是block level 还是inline 的哟~
那么，就到这里吧，大家下次见说 
0
投稿猜你喜欢
- 阅读上一篇：什么是名字空间<meta http-equiv="Content-Type" co
- 这段时间在处理SQL server 2000 SP4补丁打不上的问题上花了不少时间，回头想想应该总结一下：系统说明：dell1800服务器，
- 在动态删除iframe时，同时把iframe里嵌套的iframe 删除，遇到了这个问题。本来之前都没报错，突然昨天他们嵌套了一个 跨域 的网
- 一定要对用户可能输入的诸如引号，尖括号等特殊字符给予足够重视，它们可能引发严重的安全问题。SQL注入的基本手法之一，就是利用对单引号未加过滤
在上一篇文章中 ，我说到：强硬的把CSS和HTML塞到PHP里面可以防止代码太枯燥(DRY)并最终导致代码臃肿，因为的CSS和HTML需要比- 如果您是HTML的初学者，请您先自学HTML。因为DHTML是现有的HTML技术的一个综合，所以HTML语言对学习动态HTML是
- 如今大部分网站仍然采用表格嵌套内容的方式来制作网站，虽然此方法对于我们来说比较熟悉、比较上手；但是，它却阻碍了一种更好的、更有亲和力的、更灵
- 一般情况下会有几种情况需要你把数据库设为只读： 1. Insert,Update,Delete 触发器 2. Check 约束 和 Dele
- 各大著名厂家、公司的banner广告设计欣赏，尺寸468x60，gif格式！有acer，阿尔卡特，AMD，中国电信，爱立信，Greatwal
- 背景：pony是公司的首席体验官、首席产品经理。这次在产品峰会上pony将自己平时经验的积累与大家交流，体验较细。这次分享研发管理部，设计中
- 来蓝色一直都在潜水,很少写帖子,太对不起大家了.下面和大家探讨一个话题,希望能引起大家的兴趣.关于H1,一直都想和大家讨论H1用法的问题,可
- 由于Oracle自身比较复杂，在Linux环境下安装要涉及很多方面的因素。本文分两个方面介绍在Linux RedHat 6.0环境下Orac
- XML的未来 现在你已经知道XML。确实，结构有点复杂，而且DTD有各种可以定义文档可以包含的内容的选项。但还不只这些。考虑一个数据交换对其
- prototype框架最早是出于方便Ruby开发人员进行JavaScript开发所构建的，从这个版本上更加体现的淋漓尽致。比起1.3.1版本
- 现在很多地方都需要用到关键词过滤功能。比如一般的服务器都不允许一些词出现在网页上，站长有时候会对在本网站发布信息的内容进行一个广告过滤等。雨
- tbody 标签表格主体（正文）。该标签用于组合 HTML 表格的主体内容。tbody 元素应该与&
- 今天有个朋友做网页的时候遇到个问题：想保留链接的背景，但又要链接里的文字消失！可是弄了半天一直没办法把这个文字去掉。我想很多学标准的朋友都遇
- 近日在月影的blog上找到一段代码。看了老半天没明白什么意思，倍受打击！不死心，于是仔细分析思考了好几次，才明白过来这段函数的意义。js果然
- asp之家注：本篇asp留言本教程可以说是我见过的最详细，写的最认真的，最适合初学者来学习asp的一篇教程。在此感谢作者hemooday。可
- 为了防止网络上日益猖獗的垃圾广告和灌水评论，大多数网站在信息发布的时候要求输入验证码。图片、文字、字母甚至还有计算题。验证码图片里的信息东颠
