HTML+CSS网页设计与布局从入门到精通的目录

作者&投稿:郅耐 (若有异议请与网页底部的电邮联系)
html+css网页设计与布局从入门到精通要多久~

如果你是零基础,对HTML和CSS不熟悉,不用急着学javascript。建议先看《HTML+CSS网页设计与布局从入门到精通》,轻松易读的书在入门的时候能让你学得相对轻松,增加你的自信心,从而给你更多动力。

如果你对HTML和CSS已经有所了解,比较熟悉,选择《HTML、CSS、JavaScript网页制作从入门到精通》是开始走上javascript之路是不错的选择。

第1章 Web开发新时代 11.1 HTML5概述 21.1.1 HTML5新特性 21.1.2 HTML5组织 31.1.3 HTML5构成 41.2 HTML5设计原理 41.2.1 HTML开发历程 51.2.2 HTML5开发动力 61.2.3 HTML5设计理念 71.3 编写第一个HTML5页面 141.3.1 搭建上机练习环境 141.3.2 检测浏览器是否支持 141.3.3 使用HTML5编写简单的Web页面 151.4 HTML5页面的特征 171.4.1 使用HTML5结构化元素 171.4.2 使用CSS美化HTML5文档 19第2章 从HTML、XHTML到HTML5 21视频讲解:2小时2.1 HTML基础 222.1.1 HTML简介 222.1.2 HTML特性 222.1.3 HTML结构 232.1.4 HTML语法 232.1.5 HTML标签 252.1.6 HTML属性 292.2 XHTML基础 322.2.1 XHTML结构 322.2.2 XHTML语法 332.2.3 XHTML类型 342.2.4 DTD解析 352.2.5 命名空间 372.3 HTML5基础 382.3.1 HTML5语法 382.3.2 HTML5元素 402.3.3 HTML5增加及废除的属性 462.3.4 HTML5全局属性 482.3.5 HTML5其他功能 50第3章 创建HTML5文档 54视频讲解:1小时13分钟3.1 认识HTML5文档结构 553.2 HTML5元素分类 583.3 构建主体内容 593.3.1 标识文章 593.3.2 给内容分段 613.3.3 设计导航信息 643.3.4 设计辅助信息 663.3.5 设计微格式 673.3.6 添加发布日期 683.4 添加语义模块 693.4.1 添加标题块 693.4.2 给标题分组 703.4.3 添加脚注块 703.4.4 添加联系信息 713.5 综合实战:使用HTML5设计博客主页 723.5.1 设计大纲 733.5.2 设计样式 76第4章 实战HTML5表单 79视频讲解:1小时08分钟4.1 新增的input输入类型 804.1.1 email类型的应用 804.1.2 url类型的应用 824.1.3 number类型的应用 834.1.4 range类型的应用 844.1.5 日期检出器类型的应用 854.1.6 search类型的应用 904.1.7 tel类型的应用 914.1.8 color类型的应用 924.2 新增的input属性 934.2.1 新增的autocomplete属性 934.2.2 新增的autofocus属性 954.2.3 新增的form属性 964.2.4 新增的表单重写属性 974.2.5 新增的height与width属性 984.2.6 新增的list属性 984.2.7 新增的min、max和step属性 994.2.8 新增的multiple属性 1004.2.9 新增的pattern属性 1014.2.10 新增的placeholder属性 1014.2.11 新增的required属性 1024.3 新增的form元素 1034.3.1 新增的datalist元素 1034.3.2 新增的keygen元素 1034.3.3 新增的output元素 1044.4 新增的form属性 1054.4.1 新增的autocomplete属性 1054.4.2 新增的novalidate属性 105第5章 实战HTML5画布 106视频讲解:2小时5.1 认识HTML5 canvas元素 1075.1.1 在页面中添加canvas元素 1075.1.2 Canvas如何绘制图形 1085.1.3 认识Canvas坐标 1095.1.4 何时不用Canvas 1095.1.5 如果浏览器不支持Canvas 1105.1.6 检测浏览器支持 1105.2 绘制简单图形 1115.2.1 绘制直线 1115.2.2 绘制矩形 1125.2.3 绘制圆形 1135.2.4 绘制三角形 1155.2.5 清空画布 1165.3 绘制贝塞尔曲线 1175.3.1 绘制二次方贝塞尔曲线 1185.3.2 绘制三次方贝塞尔曲线 1195.4 图形的变换 1205.4.1 保存与恢复Canvas状态 1205.4.2 移动坐标空间 1215.4.3 旋转坐标空间 1235.4.4 缩放图形 1255.4.5 矩阵变换 1265.5 图形的组合与裁切 1295.5.1 图形的组合 1295.5.2 裁切路径 1325.6 更多的颜色和样式选项 1335.6.1 应用不同的线型 1335.6.2 绘制线性渐变 1385.6.3 绘制径向渐变 1395.6.4 绘制图案 1405.6.5 设置图形的透明度 1415.6.6 创建阴影 1425.7 绘制文字 1445.7.1 绘制填充文字 1445.7.2 文字相关属性 1455.7.3 绘制轮廓文字 1455.7.4 测量文字宽度 1465.8 操作与使用图像 1475.8.1 向Canvas中引入图像 1475.8.2 改变图像大小 1495.8.3 创建图像切片 150第6章 HTML5音频与视频 152视频讲解:50分钟6.1 HTML5多媒体技术概述 1536.1.1 关于编解码器 1536.1.2 音频编解码器 1536.1.3 视频编解码器 1546.2 浏览器支持概述 1566.2.1 用JavaScript检测音频格式支持情况 1576.2.2 用JavaScript检测视频格式支持情况 1586.3 在HTML5中播放音频 1596.3.1 认识audio元素 1596.3.2 播放音频 1606.4 在HTML5中播放视频 1616.4.1 认识video元素 1616.4.2 播放视频 1626.5 音频与视频相关属性、方法与事件 1646.5.1 音频与视频相关属性 1646.5.2 音频与视频相关方法 1676.5.3 音频与视频相关事件 1686.6 综合实战 1696.6.1 用脚本控制音乐播放 1696.6.2 查看视频帧画面 170第7章 Web存储 175视频讲解:1小时20分钟7.1 认识Web Storage 1767.1.1 Cookie存储机制的优缺点 1767.1.2 为什么要用Web Storage 1767.1.3 Web Storage的优缺点 1777.1.4 浏览器支持概述 1777.2 使用Web Storage 1787.2.1 检查浏览器的支持性 1787.2.2 设置和获取数据 1807.2.3 防止数据泄露 1817.2.4 Web Storage的其他用法 1817.2.5 Web Storage事件监测 1827.2.6 实例1:设计网页皮肤 1837.2.7 实例2:跟踪localStorage数据 1847.2.8 实例3:设计计数器 1867.2.9 综合应用:Web应用项目实时跟踪 1877.3 Web SQL数据库 1927.3.1 Web SQL数据库概述 1927.3.2 使用Web SQL数据库 1937.3.3 实例1:创建简单的本地数据库 1957.3.4 实例2:批量存储本地数据 1987.3.5 综合应用:Web Storage和Web SQL混合开发 199第8章 离线应用 207视频讲解:23分钟8.1 HTML5离线应用概述 2088.1.1 为什么要学习HTML5离线应用 2088.1.2 浏览器支持概述 2098.2 HTML5离线应用详解 2108.2.1 解析manifest文件 2108.2.2 搭建离线应用程序 2138.2.3 检查浏览器是否支持 2138.2.4 离线缓存更新实现 2138.2.5 JavaScript接口实现 2148.2.6 离线存储事件监听 2178.3 实战1:缓存首页 2188.4 实战2:离线编辑内容 2218.5 实战3:离线跟踪 225第9章 Workers多线程处理 231视频讲解:1小时01分钟9.1 认识Web Workers 2329.1.1 Web Workers概述 2329.1.2 浏览器支持概述 2339.1.3 熟悉Web Workers成员 2339.2 使用Web Workers 2349.2.1 检查浏览器支持性 2349.2.2 创建Web Workers 2349.2.3 与Web Workers通信 2359.2.4 使用Web Workers上机练习 2379.3 案例实战 2409.3.1 使用多线程实现后台运算 2409.3.2 在后台过滤值 2429.3.3 多任务并发处理 2439.3.4 在多线程之间通信 2469.3.5 使用线程技术计算Fibonacci数列 2489.3.6 使用多线程绘图 2499.4 综合应用:模拟退火算法 2539.4.1 认识模拟退火算法 2539.4.2 编写应用主页面 2549.4.3 编写worker.js 2569.4.4 与Web Workers通信 257第10章 Geolocation地理位置 26110.1 位置信息概述 26210.1.1 为什么要学习Geolocation 26210.1.2 位置信息表示方式 26210.1.3 位置信息来源 26210.1.4 IP定位 26310.1.5 GPS定位 26310.1.6 Wi-Fi定位 26310.1.7 手机定位 26410.1.8 自定义定位 26410.2 使用Geolocation API 26410.2.1 检查浏览器支持性 26410.2.2 获取当前地理位置 26510.2.3 监视位置信息 26710.2.4 停止获取位置信息 26710.2.5 隐私保护 26710.2.6 处理位置信息 26710.2.7 使用position对象 26810.3 案例实战 26910.3.1 使用Google地图 26910.3.2 跟踪行走速度 271第11章 CSS3概述 277视频讲解:1小时01分钟11.1 回顾CSS 27811.1.1 CSS发展简史 27811.1.2 CSS 1.0和CSS 2.0概述 27811.1.3 CSS与DIV标记之缘 28511.1.4 CSS编码规范 28811.2 了解CSS3新增特性 28911.2.1 属性选择器 28911.2.2 RBGA 透明度 29111.2.3 多栏布局 29211.2.4 多背景图片 29411.2.5 字符串溢出 29511.2.6 块阴影与圆角阴影 29611.2.7 圆角 29711.2.8 边框图片 29811.2.9 形变 29911.3 CSS3前景展望 30111.3.1 CSS3的应用范围 30211.3.2 当前支持CSS3的浏览器 30311.4 案例实战:设计漂亮的表单 305第12章 CSS选择器 310视频讲解:34分钟12.1 属性选择器 31112.1.1 认识属性选择器 31112.1.2 案例实战 31212.2 结构伪类选择器 31412.2.1 认识结构伪类选择器 31412.2.2 案例实战 31512.3 UI伪类选择器 32112.3.1 认识常用UI伪类选择器 32112.3.2 案例实战 32212.4 其他选择器 324第13章 文本、字体与颜色 330视频讲解:49分钟13.1 设计文本阴影 33113.1.1 定义text-shadow属性 33113.1.2 应用阴影效果 33313.1.3 综合实战:设计黑客网站首页 33913.2 定义文本样式 34113.2.1 文本样式简介 34113.2.2 溢出文本 34513.2.3 文本换行 34713.3 设计颜色样式 35313.3.1 使用RGBA颜色值 35313.3.2 使用HSL颜色值 35513.3.3 使用HSLA颜色值 35913.3.4 定义opacity属性 36013.3.5 定义transparent颜色值 363第14章 背景和边框 365视频讲解:1小时09分钟14.1 设计多色边框 36614.1.1 用法详解 36614.1.2 案例实战 36814.2 设计边框背景 36814.2.1 用法详解 36914.2.2 案例实战 37214.3 设计圆角 37514.3.1 用法详解 37614.3.2 案例实战:设计椭圆图形 37914.4 设计阴影 38014.4.1 用法详解 38014.4.2 案例实战:设计Windows7界面效果 38514.5 设计背景 39014.5.1 定义背景坐标 39014.5.2 定义背景裁剪区域 39214.5.3 定义背景图像大小 39514.5.4 定义背景图像循环方式 39614.5.5 定义多背景图像 398第15章 2D变形 400视频讲解:31分钟15.1 认识transform 40115.2 2D变形 40215.2.1 旋转动画 40315.2.2 缩放动画 40415.2.3 移动动画 40615.2.4 倾斜动画 40815.2.5 变形动画 41015.2.6 案例实战:设计涂鸦墙 41215.3 自定义变形 41415.4 定义复杂变形 416第16章 设计动画 420视频讲解:1小时20分钟16.1 平滑过渡 42116.1.1 定义过渡属性 42116.1.2 定义过渡时间 42216.1.3 定义过渡延迟时间 42316.1.4 定义过渡效果 42416.1.5 案例实战:设计Mac OS导航器 42616.2 3D动画 42816.2.1 定义动画名称 42916.2.2 定义动画时间 42916.2.3 定义动画播放方式 42916.2.4 定义动画延迟时间 42916.2.5 定义动画播放次数 43016.2.6 定义动画播放方向 43016.2.7 案例实战:设计图片翻转特效 43016.3 渐变效果 43116.3.1 设计Webkit渐变 43216.3.2 Webkit案例实战 43716.3.3 设计Gecko渐变 44016.3.4 Gecko案例实战 44616.3.5 设计IE渐变 44716.3.6 设计W3C渐变 44916.4 案例综合实战 44916.4.1 设计礼品盒 45016.4.2 设计折叠面板 45216.4.3 设计易拉罐 45416.4.4 设计光盘滑动动画 45716.4.5 设计下拉菜单 46116.4.6 设计精致按钮 465第17章 网页布局 468视频讲解:40分钟17.1 设计多列布局 46917.2 设置多列显示样式 47117.2.1 定义列宽 47117.2.2 定义列数 47217.2.3 定义列间距 47317.2.4 定义列边框样式 47517.2.5 定义跨列显示 47617.2.6 定义列高度 47817.2.7 定义打印列 48017.3 设计盒布局 48117.4 设置盒布局格式 48517.4.1 定义自适应宽度 48517.4.2 定义列显示顺序 48717.4.3 定义列排列方向 48917.4.4 定义模块大小自适应 49117.4.5 消除空白 49317.4.6 定义对齐方式 49717.5 综合实战:设计多列网页 498第18章 用户界面 506视频讲解:35分钟18.1 改变盒模型组成方式 50718.2 调节元素尺寸 50718.3 设计轮廓 50918.3.1 定义轮廓线 50918.3.2 定义轮廓线宽度 51218.3.3 定义轮廓线样式 51218.3.4 定义轮廓线颜色 51318.3.5 定义轮廓线位移 51318.4 设计导航 51618.4.1 定义导航顺序 51618.4.2 定义方向键控制顺序 51918.5 添加显示内容 52118.6 恢复默认样式 52218.6.1 取消元素样式 52218.6.2 慎用initial的情况 524第19章 CSS3其他新特性 527视频讲解:40分钟19.1 溢出处理 52819.2 自定义字体类型 53019.2.1 使用@font-face规则 53019.2.2 开放字体 53219.3 定义设备类型 53219.3.1 认识Media Queries模块 53219.3.2 认识@media规则 53319.3.3 使用@media规则 53519.3.4 在网站中应用@media规则 53719.4 添加语音功能 54319.5 设计倒影 545

第1部分 HTML基础篇
第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.4.5 设计页面方案 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
2.3.2 保存网页 19
2.4 辅助:利用Dreamweaver快速建立基本文档 20
2.5 本章小结 24
第3章 用HTML设置文本和图像 25
3.1 文本排版 25
3.1.1 实现段落与段内换行(p和br) 25
3.1.2 设置标题(h1~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
第2部分 CSS基础篇
第6章 (X)HTML与CSS概述 81
6.1 HTML与XHTML 81
6.1.1 追根溯源 81
6.1.2 DOCTYPE(文档类型)的含义与选择 82
6.1.3 XHTML与HTML的重要区别 83
6.2 (X)HTML与CSS 84
6.2.1 CSS标准 85
6.2.2 传统HTML的缺点 85
6.2.3 CSS的引入 86
6.2.4 如何编辑CSS 88
6.2.5 浏览器与CSS 89
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.16.2 更通用的解决方案 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设置背景颜色与图像 155
12.1 设置背景颜色 155
12.2 设置背景图像 156
12.3 设置背景图像平铺 157
12.4 设置背景图像位置 159
12.5 设置背景图片位置固定 162
12.6 设置标题的图像替换 163
12.7 使用滑动门技术的标题 166
12.8 本章小结 168
第3部分 CSS高级篇
第13章 CSS盒子模型 171
13.1 “盒子”与“模型”的概念探究 171
13.2 边框(border) 172
13.2.1 设置边框样式(border-style) 173
13.2.2 属性值的简写形式 174
13.2.3 边框与背景 176
13.3 设置内边距(padding) 177
13.4 设置外边距(margin) 178
13.5 盒子之间的关系 179
13.5.1 HTML与DOM 180
13.5.2 标准文档流 183
13.5.3 div标记与span标记 184
13.6 盒子在标准流中的定位原则 187
13.6.1 行内元素之间的水平margin 187
13.6.2 块级元素之间的竖直margin 188
13.6.3 嵌套盒子之间的margin 189
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个浮动的div 199
14.1.3 案例2——设置第2个浮动的div 199
14.1.4 案例3——设置第3个浮动的div 199
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.1.3 确定表格的宽度 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.2.5 按钮 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
第4部分 CSS布局篇
第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
19.4 单列布局 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调试,然后使它兼容IE 369
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




如何制作HTML页面
1、首先我们需要在桌面上,新建一张记事本 2、然后我们需要打开记事本,编写代码 3、然后我们需要把记事本修改后缀名为.html 4、然后我们需要在桌面上就会有一张网页,这一点很重要。5、最后我们需要需要在浏览器上运行该网页

tailwingcss和elmentui冲突么
冲突。_饩龇椒ㄓ泻芏啵绻梢远_tml改动的话,就给你需要细化的页面元素加多一个class或者ID就行了,当然这种方法应该不是你想要的。那么接下来是不改变 细化选择符。_偃缛质钦庋炊ㄒ逡桓鲈氐难降模?.abc {background:#000},同时这个class为abc的元素是隶属于某个元素的,比如下面这样的html代码...

html5 中的 video 如何隐藏底部的全屏按钮或控制条
可以通过更改#document片段的CSS来实现这一点,这些是DOM1规范,所有浏览器都支持。以下解决方案是特定于webkit的 video::-webkit-media-controls-fullscreen-button { display: none;} video::-webkit-media-controls-play-button {} video::-webkit-media-controls-timeline {} video::-webkit-media-...

提高Web前端性能的技巧有哪些?
另一方面,如果将JavaScript放置在head标签内或HTML文档的上部,这会阻塞HTML和CSS元素的加载过程。这个错误会导致页面加载时间增长,增加用户等待时间,容易让人感到不耐烦而放弃对网站的访问。不过,您可以通过将JavaScript属性置于_TML底部来避免此问题。此外,在使用JavaScript时,人们通常喜欢用异步脚本加载。这会阻止 ...

html中怎么调节单行文字的大小
tml字体大小设置方法,在HTML中字体如何设置字体大小,文字大小布局设置篇 DIVCSS5通过两种方法让大家掌握html中字体大小改变设置。1、html font标签设字体大小 2、html css设字体大小 接下来通过html案例介绍字体大小设置教程。一、html font标签设置字体大小 - TOP 在css之前html中文字设置字体,通常...

DreamWeaver工作区是怎么样的?工作区包括哪些元素?
9、Extract面板:CreativeCloud中的PSD文件可以上传和查看。使用这个面板,您可以从PSD复合中提取CSS、文本、图像、字体、颜色、渐变和测量值。10、插入面板:它包将图像、表格和媒体元素等各种类型的对象插入文档的按钮。每一个对象都是TML代码,允许您在插入时设置不同的属性。举例来说,你可以通过点击...

Web前端学习什么?
web前端学习的内容包括:①计算机基础以及PS基础 ②前端开发基础(HTML5开发、JavaScript基础到高级、jQuery网页特效、Bootstrap框架)③移动开发 ④前端高级开发(ECMAScript6、Veu.js框架开发、webpack、前端页面优化、React框架开发、AngularJS 2.0框架开发等)⑤小程序开发 ⑥全栈开发(MySQL数据库、Python...

web前端培训要多久?
2、第二阶段可以是css3+html5,那么这个环节学到位了,再加上前面的布局,基本上一个人是可以单独的开发一个大型的网站了,只不过是静态的,再稍微补下各个浏览器之间的兼容知识,那就更完美了。3、第三阶段就是java+jquery了,这个就相对于前面的2个阶段会难一些,那如果是你有扎实的基础,其实学...

vue制作app-如何优雅的使用vue+vux开发app
vue能开发原生app吗 可以的呢,通过第三方的混合开发工具都可以把这个打包做成APP。如何优雅的使用vue+vux开发app <!DOCTYPE_tml> __vue-vux __ __<!--include_ux_tyle--> __\/\/_egister_omponents __("actionsheet",_uxActionsheet);__("address",_uxAddress);__("alert",_uxAlert...

淘宝专业版装修css+div,左右侧悬浮窗怎么弄?以前的代码现在不能用了...
-- 悬浮模块 -->

黄梅县15524769333: HTML+CSS网页设计与布局从入门到精通和HTML、CSS、JavaScript网页制作从入门到精通 哪本书讲解的更好呢 -
出贺妥尔: 如果你是零基础,对HTML和CSS不熟悉,不用急着学javascript.建议先看《HTML+CSS网页设计与布局从入门到精通》,轻松易读的书在入门的时候能让你学得相对轻松,增加你的自信心,从而给你更多动力.如果你对HTML和CSS已经有所了解,比较熟悉,选择《HTML、CSS、JavaScript网页制作从入门到精通》是开始走上javascript之路是不错的选择.

黄梅县15524769333: 如何用css进行网页布局 -
出贺妥尔: 实现网页布局的方式方法比较多,布局方式可以大概分为这几类.布局种类:1、table布局(网页的兴起,1995)2、Flash布局(自由的黄金时代,1996)3、div+css(CSS的诞生,1998)4、栅格与响应式(移动端的兴起,2007与2010) 当前...

黄梅县15524769333: html网页布局学习,怎么入手 -
出贺妥尔: 你可以把网页布局想象成建造一栋楼房,标签(如div,span,a等)就是建造房屋的砖块,只不过这砖块可以是大的也可以是小的,可以是宽的可以是窄的,而样式css则更像是设计图纸,指挥着标签把房屋建造成自己想要的样子,比如外形的结构...

黄梅县15524769333: CSS网站布局与设计是什么 -
出贺妥尔: 是CSS配合DIV来实现的页面布局.页面由DIV,然后DIV的位置,大小,都是有CSS来定的.比表格方式要灵活多,切目前来看浏览速度比表格快,而且符合WEB 2.0的标准,但就是页面制作麻烦些!

黄梅县15524769333: DIV+CSS技术如何入门 -
出贺妥尔: CSS是Cascading Style Sheets(层叠样式表单)的简称.更多的人把它称作样式表.顾名思义,它是一种设计网页样式的工具.借助CSS的强大功能,网页将在您丰富的想象力下千变万化,越来越多的人在学习而很多初学者没有一个头绪,整...

黄梅县15524769333: 学div+css要从哪里入手?
出贺妥尔: 所谓的DIV+CSS就是层加样式表,以前你用的TABLE是单层的,说白点就相当于平面的,DIV就相当于3D的,当然这只是比喻的说法,如果你想学,就先具体去了解下DIV和CSS,光看书是没用的,多去看看别人的做好的代码,然后自己动手去把人家的代码修改成自己想要的效果,基本就能掌握了~~~ 做网页网站都是从COPY到修改到自己设计

黄梅县15524769333: div+css进行网页布局的三种方式是哪三种? -
出贺妥尔: div+css标准准确来说是xHTML+css,布局用到多个标签,不单止是div一个,布局是div,p,span,ul,li,dl,dt,dd,a,img,h,strong,em这些相互配合使用~~~

黄梅县15524769333: HTML+CSS 是什么意思
出贺妥尔: HTML(Hypertext Markup Language)是文本标记语言,是用于描述网页文档的一种标记语言. CSS(Cascading Style Sheet)可译为“层叠样式表”或“级联样式表”,它定义如何显示 HTML 元素,用于控制Web页面的外观.通过使用CSS实现页面的内容与表现形式分离,极大提高了工作效率 .样式存储在样式表中,通常放在<head>部分或存储在 外部CSS文件中.作为网页标准化设计的趋势,CSS取得了浏览器厂商的广泛支持,正越来越多的被应用到网页设计中去.

黄梅县15524769333: div - css是怎样来布局网页的? -
出贺妥尔: 在网页制作中,有许多的术语,例如:CSS、HTML、DHTML、XHTML等等.在下面的文章中我们将会用到一些有关于HTML的基本知识,而在你学习这篇入门教程之前,请确定你已经具有了一定的HTML基础.下面我们就开始一步一步使用DIV+CSS进行网页布局设计吧. 详情见:http://www.blueidea.com/tech/site/2006/3574.asp

黄梅县15524769333: 怎样制作网页 -
出贺妥尔: 一、首先得了解制作网页的工具. 1.Dreamweaver:这是网页三剑客之一,专门制作网页的工具,可以自动将网页生成代码,是普通网页制作者的首选工具,界面简单,实用功能比较强大.建议初学者选用. 2.另外一个工具就是代码编辑工具...

本站内容来自于网友发表,不代表本站立场,仅表示其个人看法,不对其真实性、正确性、有效性作任何的担保
相关事宜请发邮件给我们
© 星空见康网