一个网站，无论视觉上多美观或者内容多丰富，如果它不能适应各种浏览情况并能面向尽可能广泛的用户群，那它就不算是真正成功的网站。本书提供了基于Web标准的网页设计策略，以帮助您创建出具有高度灵活性、可读性以及用户可控性的网站。每一章都以分析一个实例开始，阐述如何使用简洁的HTML和CSS代码取代臃肿的冗余代码以创建具有极快的加载速度和很高的适应性的网站。最后，本书将各章中讨论的所有页面组件合在一起制作了一个单页模版。

本书主要内容

使用关键字和百分比设定页面文字的大小，以允许用户控制。

提供能够适应任意大小的文字或者任意数量的内容的站点导航栏。

使用浮动对象实现栏式效果。

确保页面内容在图片或CSS缺失的情况下仍然易读。

把外观从数据表格中剥离出来，再用CSS重新定义。

能自由扩大缩小的页面布局。

第1章 灵活的文字

1．1常见的方法

1．2权衡我们的选择

1．2．1长度单位

1．2．2表示“相对大小”的关键字

1．2．3百分比值

1．2．4表示“绝对大小”的关键字

1．3无懈可击的方法

1．3．1关键字

1．3．2放弃像素级别的精确度

1．3．3两个需要克服的障碍

1．3．4简化的Box Modeltack

1．4为什么说它是无懈可击的

1．5有了灵活基础后的操作

1．5．1设置基准值

1．5．2使用百分比值来获取和基准值不同的尺寸

1．6结合使用关键字和百分比值

1．6．1设定一个中间的关键字基准值

1．6．2谨慎使用嵌套百分比值

1．6．3百分比值的一致性试验

1．7本章小结

第2章 可伸缩的导航栏

2．1常见的方法

2．1．1选项卡

2．1．2通常的翻转效果

2．2为什么这样做不是无懈可击的

2．2．1堆积如山的代码

2．2．2不方便使用的问题

2．2．3可伸缩性的问题

2．2．4缺乏灵活性

2．3无懈可击的方法

2．3．1无样式

2．3．2两张小图片

2．3．3应用样式

2．3．4N，浮动来解决

2．3．5为选项卡定形

2．3．6对齐背景图片

2．3．7增加底边

2．3．8悬停变换

2．3．9选中状态

2．4为什么这样做是无懈可击的

2．5其他示例

2．5．1MOZILLAORG

2．5．2斜杠

2．5．3ESPN．COM的搜索栏

2．6本章小结

第3章 可扩展的行

3．1常见的方法

3．2为什么这样做不是无懈可击的

3．2．1非必要的图片

3．2．2固定的行高

3．2．3臃肿的代码

3．3无懈可击的方法

3．3．1HTML代码结构

3．3．2标识出各部分

3．3．3没有添加样式时的情形

3．3．4设定背景

3．3．5安排内容的位置

3．3．6消失的背景

3．3．7添加更多细节

3．3．8四个圆角

3．3．9文本和链接的细节

3．3．10最后一步

3．4为什么这样做是无懈可击的

3．4．1代码结构与设计效果的分离

3．4．2不再有固定不变的高度

3．5自适应扩展的另一个例子

3．5．1HTML代码

3．5．2创建这两张图片

3．5．3添加CSS

3．5．4EXPAND-O-MATIC

3．6本章小结

第4章 巧妙的浮动

4．1常见的方法

4．2无懈可击的方法

4．2．1对HTML代码的无止境抉择

4．2．2使用定义列表

4．2．3HTML代码结构

4．2．4没有样式时的情形

4．2．5为外围容器增加样式

4．2．6标识图片

4．2．7应用基本的样式

4．2．8给图片定位

4．2．9及同浮动

4．2．10为任意长度的描述文字开路

4．2．11尾声

4．2．12切换浮动方向

4．2．13栏式效果

4．2．14一个替代用的背景

4．3为什么这样做是无懈可击的

4．4本章小结

第5章 牢固的方框

5．1常见的方法

5．2为什么这样做不是无懈可击的

5．3无懈可击的方法

5．3．1HTML代码结构

5．3．2图片策略

5．3．3应用样式

5．4为什么这样做是无懈可击的

5．5其他圆角实现技术

5．6本章小结

第6章 页面在缺失图片或CSS的情况下仍然易读

6．1常见的方法

6．2为什么这样做不是无懈可击的

6．3无懈可击的方法

6．4为什么这样做是无懈可击的

6．5有或者没有样式

6．5．110秒钟可用性测试法

6．5．2常见的方法

6．5．3无懈可击的方法

6．6无懈可击的工具

6．6．1Favelets

6．612Web Developer Extension(Web开发者扩展)

6．6．3Web Accessibility工具条

6．6．4把校验作为一种工具

6．7本章小结

第7章 可转换的表格

7．1常见的方法

7．2为什么这样做不是无懈可击的

7．3无懈可击的方法

7．3．1HTML代码结构

7．3．2应用样式

7．4为什么这样做是无懈可击的

7．5本章小结

第8章 流动的布局

8．1常见的方法

8．2为什么这样做不是无懈可击的

8．2．1大量的代码

8．2．2维护的噩梦

8．2．3并非最佳的内容顺序

8．3无懈可击的方法

8．3．1HTML代码结构

8．3．2创建栏：浮动与定位

83．3应用样式

8．3．4Gutters

8．3．5栏的padding

8．3．6设置宽度的最大和最小值

8．3．7滑动伪分栏

8．3．8三栏布局

8．4为什么这样做是无懈可击的

8．5本章小结

第9章 构成一个整体

9．1目标

9．2为什么这样做是无懈可击的

9．2．1流动的布局

9．2．2灵活的文字

9．2．3没有图片?没有CSS?也没问题，

9．3构建过程

9．3．1HTML结构

9．3．2基本的样式

9．3．3布局结构

9．3．4侧边栏背景

9．3．5页头

9．3．6信息行

9．3．7栏问空白(gutter)

9．3．8内容栏

9．3．9侧边栏

9．3．10页脚

9．4针对IE的CSS调整

9．4．1Hack管理

9．4．2页脚补丁

9．4．3自清除问题的补丁

9．5本章小结