CSS实用案例集

前言

第1章：概要

在HTML中使用CSS

使用不同的选择符来应用样式

合理的使用类选择符和ID选择符

理解CSS属性

理解盒模型

理解文档类型（DOCTYPES）及对浏览器布局的影响

向网页中导入样式

如何使用不同类型的样式表

在CSS里添加注释

组织样式表的内容

组织样式表文件

使用简写属性

设置交互样式表

对图片使用浮动技术（Float）

使用绝对定位

使用相对定位

在AdobeDreamweaver中使用CSS

在MicrosoftExpressionWebDesigner中使用CSS

第2章：网页排版

选择字体

指定font的尺寸和大小

用更多的方式来控制文字大小

强行改变文字大小

文本居中

将文本设为左右对齐式

删除标题和段落之间的空白

设置首字符大写

设置较大、居中的大写首字符

装饰大写的首字符（图片装饰）

创建标题并样式化文本

创建标题并样式化其文本和边框

用文字和图片样式化标题

创建HTML文本的引用效果

创建带边框的引用

用图片实现引用效果

段落首行缩进

整段缩进

悬挂式缩进

样式化段落首行

用图片样式化段落首行

创建文本高亮效果

改变行距

给HTML文本添加图形处理

为文本制造阴影特效

调整字符和单词间的间距

第3章：图片

为图片镶边

删除部分浏览器为图片添加的默认边框

设置背景图片

创建一行背景图

给网页设置背景图

在一个选择符中使用多幅背景图

创建稳定的背景图

在图片上覆盖HTML文本

使用图片替换文本

用Flash文本替换HTML文本

使用多幅透明PNG图片

创造全景图效果

绑定不同的图片格式

为定宽列设置圆角

用滑动门技术实现圆角效果

用山顶角技术创建圆角效果

用JavaScipt实现圆角效果

给图片添加阴影

在图片后添加平滑的阴影

图片尺寸的缩放

创建文字气球框

防止图片的盗用

自动为图片添加倒影效果

使用图片精灵

第4章：页面元素

消除页面外边距（margin）

给滚动条着色

居中放置页面元素的技巧

设定页面边界

绘制水平线

使用Lightbox

第5章：列表

改变列表格式

实现跨浏览器的列表缩排效果

在列表项之间放置分隔符

为列表创建自定义的文本标记符

给列表添加自定义的图形标记符

用自定义的大图片作为列表标记符

用图片美化列表外观

创建内联列表（inlinelist）

在列表中创建悬挂式缩进

将标记符移动到列表内

第6章：链接和导航

删除链接下画线（并添加其他修饰）

改变链接颜色

改变网页不同部分的链接颜色

在链接末尾放置图标

改变指针形状

不用Javascript创建翻转效果(rollover)

创建文字导航菜单和翻转特效

创建水平导航菜单

创建可用热键访问的导航菜单

创建导览列

创建基于图像的翻转

创建折叠式菜单

创建上下文菜单

使用Title属性

设计动态可视化菜单

动态地改变网页样式表

第7章：表单

修改表单周围的空白

设置input元素的样式

给同一个表单中的不同input元素应用不同样式

为文本域（textarea）元素设置样式

为下拉列表和列表项元素设置样式

创建Macintosh样式的搜索框

样式化表单按钮

创建图片式提交按钮

设置只能提交一次的按钮

创建类似于HTML文本的提交按钮

将HTML文本链接制作成提交按钮

无表格的Web表单设计

不使用表格的两列式表单布局

高亮表单域

制作反馈表单

样式化Web表单的存取键（AccessKey）

将常规的表单元素分组

像使用电子数据表一样在表单中输入数据

简单的设计：登录表单

示例设计：注册表单

第8章：表格

设置单元格间距

设置边框以及单元格的内间距（padding）

设置标题（Caption）样式

设置表格单元的样式

样式化表格内的标题元素（th）

消除表格单元里的图片周围的空白

消除表格单元之间的空白

为表格单元创建交互式背景色

为表格行添加高亮效果

设计范例：制作精致的日历

第9章：页面布局

创建一列式布局

创建两列式布局

创建宽度值固定的两列式布局

用浮动（float）方式创建弹性（宽度可变）多列布局

用浮动创建宽度固定的多列布局

用定位技术创建宽度可变的多列式布局

使用定位技术创建宽度值固定的多列布局

利用浮动（float）以任意次序显示各列内容

不对称的页面布局

第10章：打印

创建友好的打印页面

制作可打印的网页表单

在链接后显示URI（通用资源标志符）

在超链接前插入特殊字符

设计范例：应用CSS的友好的用户打印界面

第11章：Hack、Workaround及Troubleshooting

从NetscapeNavigator.x中隔离样式表

为WindowsIE开发专用样式表

消除IE/Win上的网页闪烁现象

保持IE/Win浏览器中背景图片的位置固定不变

使用WinIE的条件注释导入样式

在MacIE上隐藏CSS规则

设置智能hack管理系统

诊断CSSbug和浏览器疑难杂症

在一台电脑的多个平台上测试网站设计

在一台电脑上安装多个版本的WinIE浏览器

用文本浏览器测试网站

第12章：用CSS进行设计

增大文本字号

创建独特的反差效果

合并不相似的元素实现对比效果

用反差效果吸引视线

检查色彩对比是否明显

强调引用

附录A：资源

附录B：CSS2.1属性和属性扩展

附录C：CSS2.1选择符、伪类和伪元素

附录D：表单元素的样式

索引

　　本书以“提出问题，解决问题”的速查模式安排章节，针对现实世界中的常见问题列举了大量实例，介绍了CSS技术在网页中的设计和制作。无论对于初学者还是有一定经验的开发人员，这都是一本值得推荐的好书，该书可作为网页设计人员身边常备的技术参考手册。　　当CSS技术在网页设计和制作中变得越来越流行时，网页开发的过程中遇到的问题也变得越来越多。本书以“提出问题，解决问题”的速查模式安排章节，针对现实世界中的常见问题列举了大量实例，介绍了很多实用的解决方案，每个例子都带有清晰的解释和可以随时用于实际项目的代码。全书共12章，前十章探讨排版、图片、页面元素、列表、链接、表单、表格及打印等方面的应用技巧，第11章介绍了一些用来解决浏览器兼容性的hack，最后一章列举了几个经典的CSS设计范例。附录提供了CSS属性索引速查表，CSS选择符、伪类、伪元素索引速查表等。　　无论对于初学者还是有一定经验的开发人员，这都是一本值得推荐的好书，该书可作为网页设计人员身边常备的技术参考手册。