HTML+CSS网页设计与布局从入门到精通PDF|Epub|txt|kindle电子书版本网盘下载

HTML+CSS网页设计与布局从入门到精通PDF格式电子书版下载

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

第1章 网页设计基础知识3

1.1基础概念3

1.2网页与HTML语言4

1.3 Web标准：结构、表现与行为5

1.3.1标准的重要性5

1.3.2 “Web标准”概述6

1.4初步理解网页设计与开发的过程7

1.4.1基本任务与角色7

1.4.2明确网站定位8

1.4.3收集信息和素材8

1.4.4策划栏目内容8

1.45设计页面方案9

1.4.6制作页面9

1.4.7实现后台功能9

1.4.8整合与测试网站10

1.5与设计相关的技术因素10

1.6本章小结12

第2章HTML网页文档结构13

2.1 HTML简介13

2.1.1创建第一个HTML文件13

2.1.2 HTML文件结构15

2.2简单的HTML案例16

2.3网页源文件的获取18

2.3.1直接查看源文件19

23.2保存网页19

2.4辅助：利用Dreamweaver快速建立基本文档20

2.5本章小结24

第3章用HTML设置文本和图像25

3.1文本排版25

3.1.1实现段落与段内换行（＜p＞和＜br＞）25

3.1.2设置标题（＜hl＞～＜h6＞）27

3.1.3使文字水平居中（＜center＞）27

3.1.4设置文字段落的缩进（＜blockquote＞）29

3.2设置文字列表29

3.2.1建立无序列表（＜ul＞）29

3.2.2建立有序列表（＜ol＞）30

3.3 HTML标记与HTML属性31

3.3.1用align属性控制段落的水平位置31

3.3.2用bgcolor属性设置背景颜色32

3.3.3设置文字的特殊样式34

3.3.4设置文字的大小和颜色（＜font＞）35

3.4忘记过时的HTML标记和属性35

3.5特殊文字符号36

3.6在网页中使用图像（＜img＞）38

3.6.1网页中的图片格式38

3.6.2一个简单的图片网页38

3.6.3使用路径39

3.7用width和height属性设置图片的尺寸41

3.8用alt属性为图像设置替换文本43

3.9辅助：利用Dreamweaver设置文本和图像43

3.10辅助：利用Dreamweaver代码视图提高效率47

3.10.1代码提示47

3.10.2代码折叠49

3.10.3使用拆分视图对代码快速定位49

3.11本章小结50

第4章用HTML建立超链接（＜a＞）51

4.1设置基本文字超链接51

4.1.1 URL的格式51

4.1.2 URL的类型52

4.2设置页面内部的特定目标的链接53

4.3设置图片的超链接54

4.4设置电子邮件链接54

4.5设置以新窗口显示链接页面55

4.6创建热点区域55

4.6.1用HTML建立热点区域（＜map＞和＜area＞）56

4.6.2辅助：利用Dreamweaver精确定位热点区域57

4.7框架之间的链接59

4.7.1建立框架与框架集（＜frame＞和＜frameset＞）59

4.7.2用cols属性将窗口分为左右两部分60

4.7.3用rows属性将窗口分为上中下三部分60

4.7.4框架的嵌套61

4.7.5用src属性在框架中插入网页61

4.7.6用src属性在框架之间链接62

4.7.7创建嵌入式框架（＜iframe＞）64

4.8链接增多后网站的组织结构与维护65

4.9本章小结66

第5章用HTML创建表格67

5.1表格基本结构（＜table＞）67

5.2合并单元格68

5.2.1用colspan属性左右合并单元格68

5.2.2用rowspan属性上下合并单元格69

5.3用align属性设置对齐方式70

5.4用bgcolor属性设置表格背景色和边框颜色71

5.5用cellpadding属性和cellspacing属性设定距离72

5.6完整的表格标记（＜thead＞、 ＜tbody＞和＜tfoot＞）73

5.7需要抛弃的方法：用表格进行页面布局75

5.8本章小结78

第6章（X）HTML与CSS概述81

6.1 HTML与XHTML81

6.1.1追根溯81

6.1.2 DOCTYPE（文档类型）的含义与选择82

6.1.3 XHTML与HTML的重要区别83

6.2 （X）HTML与CSS84

6.2.1 CSS标准85

6.2.2传统HTML的缺点85

6.2.3 CSS的引入86

6.2.4如何编辑CSS88

6.2.5浏览器与CSS89

6.3本章小结90

第7章CSS核心基础91

7.1构造CSS规则91

7.2基本CSS选择器92

7.2.1标记选择器92

7.2.2类别选择器93

7.2.3 ID选择器95

7.3在HTML中使用CSS的方法96

7.3.1行内样式96

7.3.2内嵌式97

7.3.3链接式98

7.3.4导入样式99

7.3.5各种方式的优先级问题100

7.4本章小结102

第8章 手工编写与借助工具103

8.1从零开始103

8.2设置标题104

8.3控制图片105

8.4设置正文106

8.5设置整体页面106

8.6对段落进行分别设置107

8.7完整代码108

8.8 CSS的注释109

8.9辅助：使用Dreamweaver创建页面109

8.10辅助：在Dreamweaver中新建CSS规则110

8.11辅助：在Dreamweaver中编辑CSS规则112

8.12为图像创建CSS规则114

8.13本章小结116

第9章CSS的高级特性117

9.1复合选择器117

9.1.1“交集”选择器117

9.1.2“并集”选择器118

9.1.3后代选择器120

9.2 CSS的继承特性122

9.2.1继承关系122

9.2.2 CSS继承的运用123

9.3 CSS的层叠特性125

9.4本章小结126

第10章用CSS设置文本样式127

10.1长度单位127

10.2颜色定义128

10.3准备页面129

10.4设置文字的字体129

10.5设置文字的倾斜效果130

10.6设置文字的加粗效果131

10.7英文字母大小写转换132

10.8控制文字的大小133

10.9文字的装饰效果133

10.10设置段落首行缩进134

10.11设置字词间距135

10.12设置段落内部的文字行高136

10.13设置段落之间的距离136

10.14控制文本的水平位置137

10.15 设置文字与背景的颜色138

10.16设置段落的垂直对齐方式138

10.16.1使用line-height属性进行设置138

10.162更通用的解决方案139

10.17本章小结140

第11章用CSS设置图像效果141

11.1设置图片边框141

11.1.1基本属性141

11.1.2为不同的边框分别设置样式142

11.2图片缩放144

11.3图文混排145

11.3.1文字环绕145

11.3.2设置图片与文字的间距146

11.4案例——八大行星科普网页147

11.5设置图片与文字的对齐方式150

11.5.1横向对齐方式150

11.5.2纵向对齐方式151

11.6本章小结154

第12章用CSS设置背景颜色与图像15

12.1设置背景颜色15

12.2设置背景图像156

12.3设置背景图像平铺157

12.4设置背景图像位置159

12.5设置背景图片位置固定162

12.6设置标题的图像替换163

12.7使用滑动门技术的标题166

12.8本章小结168

第13章CSS盒子模型171

13.1“盒子”与“模型”的概念探究171

13.2边框（border）172

13.2.1设置边框样式（border-sle）173

13.2.2属性值的简写形式174

13.2.3边框与背景176

13.3设置内边距（padding）177

13.4设置外边距（margin）178

13.5盒子之间的关系179

13.5.1 HTML与DOM180

13.5.2标准文档流183

13.5.3 ＜div＞标记与＜span＞标记184

13.6盒子在标准流中的定位原则187

13.6.1行内元素之间的水平margin187

13.6.2块级元素之间的竖直margin188

13.6.3嵌套盒子之间的margin189

13.6.4 margin属性可以设置为负值191

13.7思考题192

13.8本章小结196

第14章 盒子的浮动与定位197

14.1盒子的浮动197

14.1.1准备代码197

14.1.2案例1——设置第1个浮动的div199

14.1.3案例2——设置第2个浮动的div199

14.1.4案例3——设置第3个浮动的div199

14.1.5案例4——改变浮动的方向200

14.1.6案例5——再次改变浮动的方向200

14.1.7案例6——全部向左浮动201

14.1.8案例7——使用clear属性清除浮动的影响202

14.1.9案例8——扩展盒子的高度203

14.2盒子的定位204

14.2.1静态定位（static）204

14.2.2相对定位（relative）205

14.2.3绝对定位（absolute）209

14.2.4固定定位（fixed）214

14.3 z-index空间位置214

14.4盒子的display属性215

14.5本章小结216

第15章用CSS设置表格样式217

15.1控制表格217

15.1.1表格中的标记217

15.1.2设置表格的边框219

15.13确定表格的宽度222

15.1.4其他与表格相关的标记223

15.2美化表格224

15.2.1搭建HTML结构224

15.2.2整体设置225

15.2.3设置单元格样式226

15.2.4斑马纹效果227

15.2.5设置列样式227

15.3设置鼠标指针经过时整行变色提示的表格232

15.3.1在Firefox和IE 7中实现鼠标指针经过时整行变色232

15.3.2在IE 6中实现鼠标指针经过时整行变色233

15.3.3最终合并代码234

15.4辅助：使用jQuery实现更多效果236

15.4.1用jQuery实现斑马纹效果237

15.4.2用jQuery实现“前3行”特殊样式239

15.4.3用jQuery实现渐变背景色表格效果240

15.4.4用jQuery实现鼠标指针经过变色效果241

15.5案例——日历241

15.5.1搭建HTML结构241

15.5.2设置整体样式和表头样式244

15.5.3设置日历单元格样式245

15.6本章小结248

第16章用CSS设置链接与导航菜单249

16.1丰富的超链接特效250

16.2创建按钮式超链接252

16.3制作荧光灯效果的菜单253

16.3.1 HTML框架254

16.3.2设置容器的CSS样式254

16.3.3设置菜单项的CSS样式255

16.4控制鼠标指针257

16.5设置项目列表样式257

16.5.1列表的符号258

16.5.2图片符号260

16.6创建简单的导航菜单261

16.6.1简单的竖直排列菜单261

16.6.2横竖自由转换菜单264

16.7设置图片翻转效果265

16.8应用滑动门技术的玻璃效果菜单266

16.8.1基本思路266

16.8.2设置菜单整体效果267

16.8.3使用“滑动门”技术设置玻璃材质背景268

16.8.4进一步解决的问题269

16.9鼠标指针经过时给图片增加边框270

16.10本章小结272

第17章用CSS建立表单273

17.1表单的用途和原理273

17.2表单输入类型274

17.2.1文本输入框274

17.2.2单选按钮274

17.2.3复选按钮275

17.2.4密码输入框275

17.25按钮276

17.2.6多行文本框277

17.2.7列表框277

17.3 CSS与表单278

17.3.1表单中的元素278

17.3.2像文字一样的按钮281

17.3.3多彩的下拉菜单283

17.4案例——“数独”游戏网页284

17.4.1搭建基本表格285

17.4.2设置表格样式286

17.4.3加入文本输入框287

17.4.4设置文本输入框的样式287

17.5对齐文本框和旁边的图像按钮289

17.6本章小结290

第18章 网页样式综合案例——灵活的电子相册291

18.1搭建框架291

18.2阵列模式293

18.3单列模式298

18.4改进阵列模式301

18.5 IE 6兼容304

18.6双向联动模式306

18.6.1在Firefox中实现306

18.6.2 IE 6兼容311

18.6.3改变方向312

18.7本章小结314

第19章 固定宽度布局剖析与制作317

19.1向报纸学习排版思想317

19.2 CSS排版观念319

19.2.1两列布局320

19.2.2三列布局320

19.2.3多列布局321

19.2.4布局结构的表达式与结构图321

19.3圆角框325

19.3.1准备图像325

19.3.2搭建HTML结构326

19.3.3放置背景图像328

19.3.4设置样式并修复缺口329

194单列布局330

19.4.1放置第一个圆角框331

19.4.2设置圆角框的CSS样式331

19.4.3放置其他圆角框334

19.5 “1-2-1”固定宽度布局335

19.5.1准备工作336

19.5.2绝对定位法337

19.5.3浮动法339

19.6 “1-3-1”固定宽度布局341

19.7 “1-（（1-2）+1）-1”固定宽度布局343

19.8本章小结344

第20章 变宽度网页布局剖析与制作345

20.1 “1-2-1”变宽度网页布局345

20.1.1 “1-2-1”等比例变宽布局345

20.1.2 “1-2-1”单列变宽布局348

20.2 “1-3-1”宽度适应布局352

20.2.1 “1-3-1”三列宽度等比例布局352

20.2.2 “1-3-1”单侧列宽度固定的变宽布局352

20.2.3 “1-3-1”中间列宽度固定的变宽布局353

20.2.4进一步的思考355

20.2.5 “1-3-1”双侧列宽度固定的变宽布局356

20.2.6 “1-3-1”中列和侧列宽度固定的变宽布局358

20.3变宽布局方法总结359

20.4分列布局背景色问题360

20.4.1设置固定宽度布局的列背景色360

20.4.2设置特殊宽度变化布局的列背景色364

20.4.3设置单列宽度变化布局的列背景色364

20.5 CSS排版与传统的表格方式排版的分析365

20.6浏览器的兼容性问题368

20.7 CSS布局页面的调试技巧368

20.7.1技巧1：设置背景色或者边框确定错误范围369

20.7.2技巧2:删除无关代码暴露核心矛盾369

20.7.3技巧3：先用Firefox调试然后使它兼容IE369

20.7.4技巧4：善于利用工具提高调试效率370

20.7.5技巧5：善于提问寻求帮助370

20.8本章小结370

第21章 网页布局综合案例——儿童用品网上商店371

21.1案例概述371

21.2内容分析372

21.3 HTML结构设计374

21.4原型设计377

21.5页面方案设计380

21.6布局设计383

21.6.1整体样式设计383

21.6.2页头部分384

21.6.3内容部分386

21.6.4 页脚部分389

21.7细节设计389

21.7.1页头部分389

21.7.2内容部分395

21.7.3左侧的主要内容列395

21.7.4右边栏398

21.8 CSS布局的优点402

21.9交互效果设计403

21.9.1次导航栏403

21.9.2主导航栏404

21.9.3账号区404

21.9.4图像边框405

21.9.5产品分类407

21.10遵从Web标准的设计流程407

21.11从“网页”到“网站”408

21.11.1历史回顾408

21.11.2不完善的办法408

21.11.3服务器出场409

21.11.4 CMS出现409

21.11.5具体操作409

21.12本章小结410

附录A网站发布与管理411

A.1在Internet上建立自己的Web站点411

A.1.1制作网站内容411

A.1.2申请域名411

A.1.3信息发布411

A.2租用虚拟主机空间412

A.2.1了解基本的技术名词412

A.2.2选择和租用虚拟主机413

A.3向服务器上传网站内容414

A.3.1使用Dreamweaver上传文件414

A.3.2使用IE浏览器上传文件415

A.3.3使用专业FTP工具上传文件416

A.4网站管理418

A.4.1修改密码418

A.4.2集团邮箱管理419

A.4.3注意事项420

附录B CSS英文小字典421