CSS3的三部曲:设置字体,设置宽度和高度及盒模型,设置链接。其中,字体包括字体组,字体大小,行高,颜色。第二部包括宽度和高度及margin,padding,(margin:0 auto是实现居中)。链接文本样式包括link.hover,visitied,active 4种状态。实现的部分包括,字体...
分类:
Web程序 时间:
2015-09-05 17:56:56
阅读次数:
267
#cssborder制作小三角形1.原理是CSS盒模型一个盒子包括: margin+border+padding+content– 上下左右边框交界处出呈现平滑的斜线. 利用这个特点, 通过设置不同的上下左右边框宽度或者颜色可以得到小三角, 小梯形等.– 调整宽度大小可以调节三角形形状.2.矩形设置...
分类:
Web程序 时间:
2015-09-05 17:35:20
阅读次数:
191
渲染页面的过程:1.解析html源码,创建dom树。每个标签都是一个节点。2.解析css3.构建dom树,并且计算出样式(padding、margin等),然后构建 渲染树。对于渲染树和dom树的不同是:dom树的每一个标签都是一个节点,但是渲染树会忽略掉不需要渲染的元素,例如head、displa...
分类:
其他好文 时间:
2015-09-05 13:45:44
阅读次数:
141
元素占用宽度 = 元素宽度+padding+border+margin注意margin只是隔开元素,不会使得元素变大,而padding会使得元素变大,也就是说元素真实宽度=元素宽度+padding+borderborder 在元素的外层一、关于Padding 1、设置对象四边的内边距。默认值是0。 ...
分类:
其他好文 时间:
2015-09-04 17:06:43
阅读次数:
247
当我们使用float来使元素并排显示的时候,可以使用margin来控制元素之间的距离,而在很多版式里(例如产品图片的列表),需要浮动的元素达到两端对齐的效果,如图1所示。图1 两端对齐的版式单纯使用float:left或者float:right,而不添加额外的class区分元素的位置,似乎是无法实现...
分类:
其他好文 时间:
2015-09-04 17:03:06
阅读次数:
200
对象height:100%并不能直接产生效果,是因为跟其父对象有关。#center{height:100%;}上面的css样式是无效的,不会产生任何效果。需要改写:html,body{ margin:0px; height:100%;}#center{width:200px;height...
分类:
其他好文 时间:
2015-09-04 16:59:05
阅读次数:
137
布局——灵活使用margin(负值的应用)两列右侧自适应布局两列左侧自适应布局原理同上两列定宽高布局三列中间自适应布局
分类:
其他好文 时间:
2015-09-04 15:39:48
阅读次数:
152
它的出现还真的蛮令人惊喜的,很适用于百分比宽度。之前我们有box-sizng,而今又多了一个它,并且,calc的实用性更高。我们可以在border、margin、pading、font-size和width等属性上做一些加减乘除,简单拿width举例:.wrap {background-color:...
分类:
其他好文 时间:
2015-09-04 14:03:10
阅读次数:
147
一、前言 标题的margin collpase(margin 合并),江湖又成“margin 塌陷”;以前对margin 合并的理解就是在紧邻的兄弟元素中上一个的margin-bottom会和下一个的margin-top合并;紧邻父子元素,margin-top会合并;然后,就没有然后了。直到实际项目...
分类:
其他好文 时间:
2015-09-03 16:33:24
阅读次数:
234
BFC 已经是一个耳听熟闻的词语了,网上有许多关于 BFC 的文章,介绍了如何触发 BFC 以及 BFC 的一些用处(如清浮动,防止 margin 重叠等)。虽然我知道如何利用 BFC 解决这些问题,但当别人问我 BFC 是什么,我还...
分类:
其他好文 时间:
2015-09-03 15:25:45
阅读次数:
200