CSS快速预览
CSS的优点和益处
CSS的规则
- CSS注释
Selectors选择器
- Type选择器
- Descendant选择器
- Class选择器
- ID选择器
- 分组(Grouping)
CSS的链接方式
- 内部链接
- 外部链接
- 内嵌式CSS
创建一个内部链接的CSS样式表
创建一个外部链接的CSS样式表
添加内嵌式CSS样式表
媒体类型
Divs 和 Spans
CSS的格式化计量单位
- Pixels(px)
- Points(pt)
- Inches(in),Centimeters(cm)和Millimeters(mm)
- Picas(pc)
- Ems(em)
- Exs(ex)
The Inherit Value
@import
CSS字体
Font-传统的格式化方式
字体
- 通过字体名指定
- 通过类别指定字体
字体大小
- 字体大小单位
- 相对大小
- 练习
字体名称和字体大小
字体样式(Font-style)
变体(Font-variant)
字体粗细(Font-weight )
Font Style, Font Variant and Font Weight
CSS 文本属性
字符间距(Letter-spacing)
单词间距(Word-spacing)
行高(Line-height )
文本对齐方式(Text-align)
下划线(Text-decoration )
文本缩进(Text-indent)
文本转换(Text-transform)
垂直对齐方式(Vertical-align)
空白(White-space)
文本属性(Text Properties) | |
![]() |
颜色和背景
CSS中color的内容
- 颜色名称
- 十六进制颜色值
- 短十六进制颜色值
- 功能标记
- 建议
颜色
背景颜色
背景图片
- 背景颜色
- 背景附着
- 背景定位
颜色和背景
Borders, Margins和Padding
边框(Borders)
- 边框类型(Border-style)
- 边框颜色(Border-color)
- 边框宽度(Border-width)
- 边框(Border)
外边距(Margin)
- 定义外边距
内边距(Padding)
- 定义内边距
CSS和链接
伪类
CSS按钮链接
修改链接
用CSS实现列表功能
列表样式类型(List-style-type)
列表样式位置(List-stype-position)
列表样式图片(List-style-image)
元素定位和可见性
元素浮动(Element Flow)
位置(Position)
- 绝对定位(Absolute Positioning)
- 相对定位(Relative Positioning)
- 固定位置(Fixed Positioning)
Z-index
显示(Display)
可见性(Visibility)
浮动(Float)
清除浮动(Clear)
浏览器兼容性问题
怪异模式(Quirks Mode)
- 关闭怪异模式
- 设计思想
Internet Explorer 条件语句
通用浏览器Bugs
- IE5和IE5.5盒子模型Bug
- 双倍边距的Bug
- 浮动宽度的Bug
- 3像素间隙Bug
Fixing the Box Model Bug | |