盒子模型的边框就是围绕着内容及补白的线,这条线你可以设置它的粗细、样式和颜色(边框三个属性)。如下面代码为div来设置边框粗细为2px、样式为实心的、颜色为红色的边框:div{ border:2px solid red;}上面是border代码的缩写形式,可以分开写:div{ bor...
分类:
Web程序 时间:
2015-02-26 16:09:46
阅读次数:
94
传统的表格排版是通过大小不一的表格和表格嵌套来定位排版网页内容,改用css排版后,通过由css定义的大小不一的盒子和盒子嵌套来编排网页。css盒子模型是div排版的核心。
说白了就是以前没用css盒子模型,html中的元素就像一堆散乱的苹果;用了之后,就变成整箱整箱的苹果摞到一起。这种方式排版的网页,代码简洁,更新方便,容易兼容多种浏览器。
nice to meet you!
...
分类:
Web程序 时间:
2015-02-25 15:39:06
阅读次数:
178
盒子模型的边框就是围绕着内容及补白的线,这条线你可以设置它的粗细、样式和颜色(边框三个属性)。如下面代码为div来设置边框粗细为2px、样式为实心的、颜色为红色的边框:div{ border:2px solid red;}上面是border代码的缩写形式,可以分开写:div{ bor...
分类:
其他好文 时间:
2015-02-13 13:11:14
阅读次数:
243
从这一节开始,我们就进入本系列的第三部分——css呈现。本部分将描述css在页面的几种布局和呈现的特性。包括两类:文字、块。
第一类——文字。这部分相对比较简单一些,例如设置字号、字体、颜色、背景色、是否加粗等。重点的地方在于设置字体、设置行高、文字相关的距离都用相对值,这些东西在《css知多少(4)——解读浏览器默认样式》那一节已经说过了。另外还有一个重点,就是web端最流行的字体库fontAwesome,关于它我之前有一篇文章专门讲过,请参见《请用fontAwesome代替网页icon小图标》,这...
分类:
Web程序 时间:
2015-02-12 09:19:52
阅读次数:
205
1. 引言 从这一节开始,我们就进入本系列的第三部分——css呈现。本部分将描述css在页面的几种布局和呈现的特性。包括两类:文字、块。 第一类——文字。这部分相对比较简单一些,例如设置字号、字体、颜色、背景色、是否加粗等。重点的地方在于设置字体、设置行高、文字相关的距离都用相对值,这些东西在《.....
分类:
Web程序 时间:
2015-02-12 09:16:47
阅读次数:
156
dpi:一英寸内有多少个像素点。 px :像素,屏幕上的点,不推荐使用这种单位。 dp :dp=dip(device independent pixels)设备独立像素,方便在不同分辨率的手机上显示效果一致,一般设置宽度及高度用。换算公式: ...
分类:
移动开发 时间:
2015-02-12 00:50:56
阅读次数:
509
布局: box1 box2测试1(默认样式):测试2(设置长度和宽度):body, div { margin: 0; padding: 0;}.box { width: 100px; height: 50px;}效果:在 CSS 中,width 和 height ...
分类:
其他好文 时间:
2015-02-11 23:15:52
阅读次数:
256
1. 盒子模型 2. CSS边框 border-radius 圆角边框 box-shadow 边框阴影3. CSS外边距合并 遵循 选取两个margin较大的 的原则4. 基本应用 盒子模型 ...
分类:
Web程序 时间:
2015-02-10 22:52:50
阅读次数:
208
一、css1、盒子模型2、浮动3、定位二、javascript1、JavaScript 标准参考教程(alpha)2、阮一峰javascript教程三、javascript库四、javascript框架五、前端工程化1、对话百度前端工程师张云龙:F.I.S与前端工业化2、Javascript模块化编...
分类:
其他好文 时间:
2015-02-10 16:39:57
阅读次数:
117
本文根据在慕课网的学习笔记整理。盒子模型:边界+边框+填充+内容边界元素与其它元素之间的距离可以使用边界(margin)来设置。边界也是可分为上、右、下、左。如下代码:div{margin:20px 10px 15px 30px;}//也可以分开写:div{ margin-top:20px; ...
分类:
Web程序 时间:
2015-02-04 16:08:21
阅读次数:
139