精通 CSS 网页布局PDF|Epub|txt|kindle电子书版本网盘下载

精通 CSS 网页布局PDF格式电子书版下载

注意：本站所有压缩包均有解压码： 点击下载压缩包解压工具

第1章 CSS布局基础1

1.1认识网页中的CSS1

1.1.1编写符合CSS布局的HTML结构1

1.1.2 DOCTYPE（文档类型）与CSS的关系3

1.2 CSS基本语法和用法4

1.2.1 CSS基本语法4

1.2.2应用CSS样式5

1.2.3建立外部样式表6

1.2.4在HTML中导入外部样式表7

1.3 CSS的属性和属性值8

1.3.1如何记忆CSS的属性8

1.3.2 CSS的取值单位9

1.4 CSS常用选择符10

1.4.1标签选择符10

1.4.2类选择符11

1.4.3 ID选择符13

1.5 CSS高级选择符15

1.5.1认识HTML文档的树状结构15

1.5.2子选择符17

1.5.3相邻选择符18

1.5.4属性选择符19

1.6灵活使用CSS选择符23

1.6.1 CSS选择符分组23

1.6.2通配选择符24

1.6.3包含选择符24

1.6.4伪类和伪元素选择符26

1.6.5 CSS选择符的嵌套27

1.7 CSS的继承性28

1.7.1认识CSS的继承性28

1.7.2 CSS继承性的局限性29

1.8 CSS样式层叠和选择符优先级31

1.8.1 CSS样式表的优先级31

1.8.2 CSS样式的优先级31

1.8.3 CSS选择符的优先级31

第2章 使用Dreamweaver实现CSS布局33

2.1认识Dreamweaver的CSS布局工作流33

2.1.1增强CSS功能的【属性】面板33

2.1.2【页面属性】对话框35

2.1.3【CSS样式】面板36

2.1.4属性表37

2.2操作【CSS样式】面板38

2.2.1新建样式38

2.2.2定义样式的属性39

2.2.3应用样式43

2.3以CSS技术为核心的设计视图45

2.3.1强大的CSS设备类型45

2.3.2可视化助理47

2.4使用DW实现CSS布局实战49

2.4.1使用Dreamweaver CS3构建页面结构49

2.4.2使用【页面属性】统一基本样式51

2.4.3使用【CSS样式】面板定制页面基本布局54

第3章 听话的文字和版式56

3.1看懂Dreamweaver CS3提供的模板56

3.1.1善于利用示例页56

3.1.2挖掘标准网页布局模板的价值60

3.2你的文字听话吗62

3.2.1国际雅虎和中国雅虎62

3.2.2选择好单位让你的文字更听话64

3.2.3设计网页字体大小配置方案65

3.2.4设计与字体大小相关联的网页布局68

3.3留心，不要让你的文字“露怯”70

3.3.1不要以为多此一举71

3.3.2让网页字体显示更灵活71

3.3.3别忘了通用字体72

3.4小家伙，你向哪儿看齐73

3.4.1文本对齐74

3.4.2布局居中74

3.4.3布局元素向左、右对齐75

3.4.4文本和元素垂直对齐76

3.4.5绝对定位元素居中显示78

3.4.6混合结构中对齐处理80

3.5咱们比比个吧81

3.5.1什么样的行高更合适阅读82

3.5.2行高、边距和伪行高83

3.6让网页看起来和颜悦色85

3.6.1在CSS中使用颜色85

3.6.2 CSS布局与配色86

第4章 扮靓网页的天使——图像89

4.1选择：前景图像和背景图像89

4.1.1前景图像89

4.1.2背景图像90

4.1.3如何选用前景图像和背景图像91

4.1.4走出迷失的图像URL91

4.2图像边框和阴影93

4.2.1定义边距93

4.2.2巧设边距94

4.2.3为图像增加阴影96

4.2.4为img元素定义默认阴影样式98

4.2.5设计晶莹剔透的水印99

4.3图文混合排版101

4.3.1单行图文定位101

4.3.2单行图文对齐103

4.3.3图文环绕106

4.3.4调整图文环绕的间距108

4.3.5不规则图文环绕108

4.4隐形的翅膀——背景图像111

4.4.1控制背景图像的重复显示111

4.4.2背景图像水平平铺应用示例112

4.4.3背景图像垂直平铺应用示例113

4.4.4精确定位背景图像114

4.4.5固定背景图像在浏览器中的位置117

4.4.6如何增加多个背景图像118

4.4.7设计更酷的圆角120

4.5背景图像布局应用——伪列布局124

第5章 活泼的超链接和导航菜单132

5.1轻松掌握超链接样式132

5.1.1怪异的伪类132

5.1.2超链接的四种状态133

5.1.3为超链接绑定不同的样式134

5.1.4为页面定义不同的超链接样式135

5.2花枝招展的超链接样式137

5.2.1为超链接定义普通样式137

5.2.2避免影响版面晃动的超链接样式138

5.2.3模拟按钮样式139

5.2.4使用图像设计超链接样式141

5.2.5设计具有扩展性的超链接样式143

5.3构建导航条列表框架及其基本样式144

5.3.1为什么使用项目列表来构建导航条145

5.3.2搭架结构合理的导航列表145

5.3.3使用定义列表搭架导航列表147

5.3.4控制项目列表的样式147

5.3.5有趣的项目符号148

5.3.6自定义图片项目符号149

5.3.7通过背景图像来定义项目符号150

5.3.8使用行内显示法设计项目列表水平显示151

5.3.9使用浮动法设计项目列表水平显示153

5.3.10设计水平浮动列表的超链接样式153

5.3.11解决浮动溢出问题154

5.3.12使用定位法设计项目列表水平显示155

5.4设计导航菜单155

5.4.1淡雅的垂直导航菜单156

5.4.2巧妙的水平导航菜单158

5.4.3背景图像在导航菜单中的应用161

5.4.4实用的多级菜单164

5.4.5时尚的滑动门菜单167

第6章 更专业的表格和表单170

6.1用好表格170

6.1.1正确使用表格170

6.1.2优化数据表格的结构174

6.1.3设计表格样式176

6.2表格样式设计实战178

6.2.1设计表格行样式179

6.2.2设计表格列样式180

6.2.3设计鼠标经过时表格行的样式180

6.3用好表单182

6.3.1认识表单182

6.3.2设计表单样式184

6.4表单样式设计实战186

6.4.1设计高亮显示当前表单样式187

6.4.2设计图标样式的表单效果188

6.4.3设计易用性表单效果190

第7章 浮动的网页布局194

7.1 CSS的“水立方”模型194

7.1.1盒模型194

7.1.2盒模型解疑195

7.1.3盒模型的外边距196

7.1.4行内元素的外边距197

7.1.5块状元素的外边距198

7.1.6浮动元素的外边距198

7.1.7绝对定位元素的外边距199

7.1.8盒模型的内边距200

7.1.9盒模型的边框202

7.1.10盒模型的宽和高203

7.2构建符合标准的网页结构205

7.2.1是内容决定结构，还是表现决定结构205

7.2.2选择好结构标签207

7.2.3研究禅意花园的网页结构207

7.3 CSS浮动布局基础211

7.3.1认识网页布局类型211

7.3.2准备有趣的模块浮动游戏211

7.3.3①②③顺序的水平布局212

7.3.4③②①顺序的水平布局212

7.3.5②①③顺序的水平布局213

7.3.6③①②顺序的水平布局214

7.3.7①-②③结构布局216

7.4 CSS浮动布局高级技术217

7.4.1探究浮动元素的空间大小217

7.4.2探究浮动元素的移动位置218

7.4.3探究浮动元素的环绕关系220

7.4.4浮动与清除222

7.4.5浮动元素包含其他对象的问题及其解决方法224

7.4.6浮动元素被其他对象包含的问题及其解决方法225

7.4.7浮动布局中元素垂直间距问题以及解决方法227

7.4.8浮动布局中元素水平间距问题以及解决方法228

7.4.9浮动布局中浮动元素并列错位问题以及解决方法230

7.5 CSS浮动布局实战232

7.5.1深红色咖啡馆232

7.5.2阳光灿烂喜洋洋237

第8章 精确的网页布局243

8.1 CSS精确布局的定位原理243

8.1.1认识position243

8.1.2静态定位244

8.1.3绝对定位245

8.1.4相对定位245

8.1.5固定定位248

8.2定位布局中参照物和坐标系250

8.2.1绝对定位的参照物250

8.2.2绝对定位的坐标系253

8.2.3绝对定位的相对论255

8.2.4相对定位参照物和坐标系256

8.3定位布局中元素层叠处理257

8.3.1定位元素的层叠顺序258

8.3.2定位元素与文档流的层叠关系259

8.3.3定位元素的层叠包含关系260

8.4 CSS定位布局实战262

8.4.1米老鼠卡通画册262

8.4.2禅意花园展室267

8.4.3蓝色的多瑙河272

第9章 兼容性网页布局278

9.1智能的IE条件语句278

9.1.1认识IE条件语句278

9.1.2 IE条件语句基本用法279

9.1.3 IE条件语句在实践中应用282

9.2探析IE浏览器渲染网页布局的特性286

9.2.1认识IE浏览器的渲染特性——Layout286

9.2.2操控IE元素的Layout特性287

9.2.3网页元素的Layout特性287

9.2.4行内元素的Layout特性290

9.2.5与Layout特性相关的IE解析Bug和解决方法290

9.2.6能够更好兼容不同浏览器293

9.2.7 Layout元素与包含浮动元素的关系293

9.2.8 Layout元素与相邻浮动元素的关系295

9.2.9 Layout元素与列表元素的关系296

9.2.10 Layout元素与定位元素的关系299

9.3浏览器兼容技术解析300

9.3.1你的浏览器符合标准吗300

9.3.2兼容IE 6版本浏览器302

9.3.3兼容IE 5系列版本浏览器303

9.3.4兼容IE 7版本浏览器305

9.3.5兼容FF等标准浏览器305

9.4深入剖析CSS层叠布局306

9.4.1认识CSS层叠包含框306

9.4.2 CSS层叠包含框嵌套关系308

9.4.3 IE在解析CSS层叠关系时的Bug309

9.4.4探析CSS层叠负值以及IE存在Bug310

9.5 IE浏览器常见Bug及其解决方法312

9.5.1超链接设计中存在的Bug312

9.5.2 IE元素的内容与背景分离显示的Bug313

9.5.3 IE 6躲躲猫Bug314

9.5.4 IE 6多余字符Bug315

9.6兼容性网页布局实战316

9.6.1三列等高布局新法及其非IE存在的Bug和解决方法316

9.6.2三列浮动布局中IE的垂直空隙Bug及其兼容方法320

第10章 网页结构化布局与实施323

10.1设计网页基本结构323

10.1.1网页基本结构的设计思路323

10.1.2设计符合SEO的网页结构326

10.2单列版式布局327

10.2.1单列版式的布局结构和设计方法328

10.2.2单列固定宽度版式设计330

10.2.3单列固定宽度版式实施332

10.2.4江南水乡意象画布局设计334

10.2.5江南水乡意象画布局实战337

10.3单列液态框架版式布局340

10.3.1使用CSS设计框架结构340

10.3.2使用CSS设计单列液态布局343

10.4两列版式布局346

10.4.1两列版式的布局结构和设计方法347

10.4.2两栏浮动版式中兼容固定和自适应宽度的设计方法和探索349

10.4.3两栏浮动版式中自适应宽度的设计方法和探索351

10.4.4两栏浮动版式中兼容性宽度的设计方法和探索353

10.4.5两栏固定版式的设计方法和探索354

10.4.6黑色理想网页布局实施实战355

10.5三列版式布局361

10.5.1三列版式的布局结构和设计方法361

10.5.2解析 Dreamweaver CS3提供的绝对定位布局及存在问题362

10.5.3三列液态版式的设计新方法和探索364

10.5.4三列固定版式设计方法和探索366

10.5.5一列液态两列固定版式设计方法和探索367

10.5.6二列液态一列固定版式设计方法和探索369

10.5.7山鹰之美网页布局实战370

第11章 CSS框架设计及其案例解析376

11.1 CSS框架设计376

11.1.1什么是CSS框架376

11.1.2分析CSS框架的优缺点377

11.1.3如何设计CSS框架378

11.2 CSS框架的抽象性及其设计378

11.2.1认识CSS的类样式379

11.2.2 CSS类样式的实施策略379

11.2.3通用CSS类样式设计380

11.2.4 CSS框架中元素默认样式设计383

11.2.5 CSS框架中其他类型选择符样式的处理386

11.3 CSS框架的可维护性及其设计387

11.3.1 CSS框架的注释技巧及其可读性387

11.3.2 CSS框架中类名和ID名的可读性388

11.3.3 CSS框架代码的排版格式应简明直观389

11.3.4框架内样式代码的结构顺序应符合一定的阅读习惯391

11.4 CSS框架的可扩展性和兼容性及其设计391

11.4.1 CSS的继承性及其利用391

11.4.2 CSS框架的继承与包含关系及其应用393

11.4.3通过样式表的分类、组织实现CSS框架的可扩展性395

11.4.4 CSS框架的可兼容性397

11.5 CSS框架案例解析397

11.5.1解析Elements CSS框架398

11.5.2解析Blueprint CSS框架401

第12章 购物网站结构与布局实施409

12.1设计购物网站的基本结构409

12.1.1网站内需分析409

12.1.2设计网站的基本结构411

12.1.3完善语义化结构413

12.2使用CSS完成基本结构的布局415

12.2.1实施网页基本布局415

12.2.2设计滑动门菜单417

12.2.3设计圆角区域419