盒模型 .box { width: 200px; height: 200px; border: 2px solid red; } 通常设置的width、height，仅仅指内容区域，不包含border、padding在内。但是，可以通过设置 box-sizing属性，指定盒模型区域，box-sizi...
分类：
Web程序 时间：
2016-01-03 00:19:51
阅读次数：
286
CSS样式规则的学习是很繁琐和枯燥的，因为它不像物理、数学或者其他编程语言一样有一些基本概念、有一些基本公理或者规则，其他所有的表现都是概念在这些公里或者规则之下的逻辑游戏，CSS是有一些基本概念，但它没有说给你几条规则然后所有的表现都是在这些规则之下的任意自由组合，你要推测一个样式声明块的在页面中...
分类：
Web程序 时间：
2015-12-15 10:22:42
阅读次数：
186
SVG元素不像HTML元素一样由CSS盒模型管理。这使得我们可以更加灵活定位和变换这些元素-也许一眼看上去不太直观。然而，一旦你理解了SVG坐标系和变换，操纵SVG会非常简单并且很有意义。本篇文章中我们将讨论控制SVG坐标系的最重要的三个属性：viewport，viewBox， 和preserveA...
分类：
Web程序 时间：
2015-12-14 15:57:39
阅读次数：
257
CSS盒模型是比较复杂的，尤其是当页面中有滚动条时，仅仅通过css来操作高度宽度是不够的，幸运的是Javascript提供了不少这样的接口。Javascript中clientHeight/cliengWidth，scrollHeight/scrollWidth，offsetHeight/offset...
分类：
其他好文 时间：
2015-12-13 22:01:34
阅读次数：
219
来看下CSS标布局情况下，定位相关属性之间的相互作用。...
分类：
Web程序 时间：
2015-10-28 10:51:01
阅读次数：
190
盒模型转http://www.cnblogs.com/cchyao/archive/2010/07/12/1775846.html1.w3c标准的盒模型和ie的盒模型主要差别在于content的width和height是否包含border padding2.标准的content是不包含border ...
分类：
Web程序 时间：
2015-09-21 23:51:21
阅读次数：
247
css盒模型在不同浏览器中不同的解析方式,也是IE浏览器著名的bug。
分类：
Web程序 时间：
2015-09-20 14:36:28
阅读次数：
134
#cssborder制作小三角形1.原理是CSS盒模型一个盒子包括: margin+border+padding+content– 上下左右边框交界处出呈现平滑的斜线. 利用这个特点, 通过设置不同的上下左右边框宽度或者颜色可以得到小三角, 小梯形等.– 调整宽度大小可以调节三角形形状.2.矩形设置...
分类：
Web程序 时间：
2015-09-05 17:35:20
阅读次数：
191
当你用编辑器新建一个html页面的时候你一定会发现最顶上都会有一个DOCTYPE标签，例如：以上几种DOCTYPE都是标准的文档类型，无论使用哪种模式完整定义DOCTYPE，都会触发标准模式，而如果DOCTYPE缺失则在ie6，ie7，ie8下将会触发怪异模式（quirks 模式）。首先定义一个di...
分类：
Web程序 时间：
2015-08-17 11:49:51
阅读次数：
490
因为HTML流式文档的特性，页面布局往往是新手最为头疼的问题之一。 每个HTML元素都会渲染为一个Box，可分为inline Box和block Box。 根据display属性的不同，Box的呈现方式又有所不同。
本文首先引入CSS盒模型，然后通过不同的display属性分别介绍Box常见的呈现方式。
Box Sizing：元素大小的计算方式
在HTML中，任何HTML元素都会被...
分类：
Web程序 时间：
2015-08-11 18:56:58
阅读次数：
177
