当前位置:主页 > 书籍配套资源 > 网页设计配套资源
《Div+CSS网页样式与布局从入门到精通》课件,实例文件

《Div+CSS网页样式与布局从入门到精通》课件,实例文件

  • 更新:2021-12-15
  • 大小:71.36 MB
  • 类别:网页设计
  • 作者:刘西杰、夏晨
  • 出版:人民邮电出版社
  • 格式:PDF

  • 资源介绍
  • 相关推荐

编辑推荐

本书系统地介绍了 CSS 样式基础理论和实际应用技术,并通过实例,使初学者能够全面、快速地掌握Div+CSS 网页布局的方法和技巧。

全面详尽 ,实战精通

案例贯穿全书,详尽介绍Div+CSS布局理论知识和实技能。

循序 ,疑难解答

全面归纳 Div+CSS网页样式设计与布局过程中的各种疑难问题。

紧跟趋势

兼顾HTML5、CSS3和移动设计,掌握全新的网页制作技术。

配备课件 ,便于总结

随书附子课件,便于老师课堂教学和学生把握知识要点。

目录

  • 第1章 怎样开发设计
  • 1.1 开发设计需要什么
  • 1.1.1 需要HTML文件
  • 1.1.2 需要DIV来布局
  • 1.1.3 需要CSS来定义样式
  • 1.1.4 需要JavaScript
  • 1.2 通过Dreamweaver开发DIV+CSS
  • 1.2.1 通过Dreamweaver在HTML页面里插入DIV
  • 1.2.2 Dreamweaver的CSS代码支持
  • 1.3 一个简单的网页需含什么
  • 1.3.1 head部分
  • 1.3.2 body部分
  • 1.3.3 编写注释
  • 第2章 HTML入门基础
  • 2.1 HTML标签
  • 2.1.1 段落标签
  • 2.1.2 文本标签
  • 2.1.3 超链接标签
  • 2.1.4 图像标签
  • 2.1.5 表格标签
  • 2.2 HTML 5简介
  • 2.2.1 HTML5基础
  • 2.2.2 向后兼容
  • 2.2.3 更加简化
  • 2.2.4 HTML 5语法中的3个要点
  • 2.3 新增的主体结构元素
  • 2.3.1 实例应用——article元素
  • 2.3.2 实例应用——section元素
  • 2.3.3 实例应用——nav元素
  • 2.3.4 aside元素
  • 2.4 新增的非主体结构元素
  • 2.4.1 实例应用——header元素
  • 2.4.2 实例应用——hgroup元素
  • 2.4.3 实例应用——footer元素
  • 2.4.4 实例应用——ress元素
  • 第3章 CSS样式设计基础
  • 3.1 初识CSS
  • 3.1.1 CSS基本语法
  • 3.1.2添加CSS的方法
  • 3.1.3 设计第一个实例
  • 3.2 CSS选择器
  • 3.2.1 CSS选择器概述
  • 3.2.2 标签选择器
  • 3.2.3 类选择器
  • 3.2.4 ID选择器
  • 3.2.5 伪类选择器和伪元素
  • 3.2.6 群组选择器
  • 3.2.7 相邻选择器
  • 3.2.8 通用选择器
  • 3.3 CSS属性和属性值
  • 3.3.1 CSS属性
  • 3.3.2 CSS单位
  • 3.3.3 设置颜色
  • 第4章 使用CSS设置文本和段落样式
  • 4.1字体属性
  • 4.1.1 字体font-family
  • 4.1.2 字号font-size
  • 4.1.3 字体风格font-style
  • 4.1.4 字体加粗font-weight
  • 4.1.5 字体变形font-variant
  • 4.2 段落属性
  • 4.2.1 单词间隔word-spacing
  • 4.2.2 字符间隔letter-spacing
  • 4.2.3 文字修饰text-decoration
  • 4.2.4 垂直对齐方式vertical-align
  • 4.2.5 文本转换text-transform
  • 4.2.6 对齐方式text-align
  • 4.2.7 文本text-indent
  • 4.2.8 文本行高line-height
  • 4.2.9 处理空白white-space
  • 4.2.10 文本反排unicode-bidi、direction
  • 4.3 实例应用
  • 4.3.1 控制文本的行高和间隔
  • 4.3.2 实现文本垂直居中
  • 第5章 使用CSS设置图片和背景样式
  • 5.1 图片样式设置
  • 5.1.1 定义图片边框
  • 5.1.2 文字环绕图片
  • 5.2 背景样式设置
  • 5.2.1 设置页面背景颜色
  • 5.2.2 定义背景图片
  • 5.2.3 背景图片的重复
  • 5.2.4背景关联
  • 5.2.5 定义背景图片的位置
  • 5.3 实例应用
  • 5.3.1 鼠标经过图片显示文字
  • 5.3.2 鼠标移上改变图片透明度
  • 5.3.3 将正方形图片显示为圆形图片
  • 5.3.4 多图排列展示放大特效
  • 第6章 使用CSS控制列表样式
  • 6.1 有序列表
  • 6.1.1 有序列表ol
  • 6.1.2 有序列表的序号类型type
  • 6.1.3 有序列表的起始数值start
  • 6.2 无序列表
  • 6.2.1 无序列表标签
  • 6.2.2 无序列表的类型type
  • 6.2.3 目录列表标签
  • 6.2.4 定义列表标签
  • 6.2.5 菜单列表标签
  • 6.3 实例应用
  • 6.3.1 设计背景变换的导航栏目
  • 6.3.2 设计横向导航菜单
  • 6.3.3 竖排导航
  • 6.3.4 设计网页下拉菜单
  • 6.3.5商品列表分类可右侧展开详细分类
  • 6.3.6 CSS网页导航条
  • 第7章 使用CSS设计表单样式
  • 7.1 表单form
  • 7.1.1 程序提交action
  • 7.1.2 表单名称name
  • 7.1.3 传送方法method
  • 7.1.4 编码方式enctype
  • 7.1.5 目标显示方式target
  • 7.2 插入表单对象
  • 7.2.1 文字字段text
  • 7.2.2 密码域password
  • 7.2.3 单选按钮radio
  • 7.2.4 复选框checkbox
  • 7.2.5 普通按钮button
  • 7.2.6 提交按钮mit
  • 7.2.7 重置按钮reset
  • 7.2.8 图像域image
  • 7.2.9 隐藏域hen
  • 7.2.10 文件域file
  • 7.3 菜单和列表
  • 7.3.1 下拉菜单
  • 7.3.2 列表项
  • 7.4 表单样式实例
  • 7.4.1 定义背景样式
  • 7.4.2 设置输入文本的样式
  • 7.4.3 下划横线代替文本框特效
  • 7.4.4 随鼠标点击换色的输入框
  • 7.4.5文本框中只能输入数字
  • 第8章使用CSS设计表格样式
  • 8.1 创建表格
  • 8.1.1 表格的基本构成table、tr、td
  • 8.1.2 设置表格的标题caption
  • 8.2 设置表格基本属性
  • 8.2.1 设置表格宽度width
  • 8.2.2 设置表格高度height
  • 8.2.3 设置表格对齐方式align
  • 8.3 设置表格的属性
  • 8.3.1表格的边框宽度border
  • 8.3.2 表格边框颜色bordercolor
  • 8.3.3 设置表格阴影
  • 8.3.4 设置表格的渐变背景
  • 8.4实例应用
  • 8.4.1 变换背景色的表格
  • 8.4.2 表格隔行换色特效
  • 8.4.3 dl dt实现表格布局
  • 8.4.4 鼠标经过时改变表格行的颜色
  • 8.4.5 CSS用虚线美化表格的边框
  • 第9章 使用CSS定义链接样式
  • 9.1 链接样式设置基础
  • 9.1.1 光标属性cursor
  • 9.1.2 定义下划线样式text-decoration
  • 9.1.3 未访问过的链接a:link
  • 9.1.4 鼠标悬停时状态a:hover
  • 9.1.5 已访问超链接样式a:visited
  • 9.1.6 超链接的激活样式a:active
  • 9.2 实例应用
  • 9.2.1 不同的鼠标显示样式
  • 9.2.2向链接添加不同的样式
  • 9.2.3 按钮式超链接
  • 9.2.4翻转式超链接
  • 9.2.5 设计导航菜单
  • 第10章 CSS中的滤镜
  • 10.1 滤镜概述
  • 10.2 动感模糊
  • 10.3 对颜行透明处理
  • 10.4 设置阴影
  • 10.5 对象的翻转
  • 10.6 发光效果
  • 10.7 X光片效果
  • 10.8 波形滤镜
  • 10.9 遮罩效果
  • 第11章 DIV+CSS布局入门
  • 11.1认识盒模型
  • 11.2 外边距
  • 11.2.1 上外边距margin-top
  • 11.2.2 右外边距margin-right
  • 11.2.3 下外边距margin-bottom
  • 11.2.4 左外边距margin-left
  • 11.3 内边距
  • 11.3.1 左内边距ping-top
  • 11.3.2 右内边距ping-right
  • 11.3.3 下内边距ping-bottom
  • 11.3.4 左内边距ping-left
  • 11.4 边框
  • 11.4.1 边框样式border-style
  • 11.4.2 边框宽度border-width
  • 11.4.3 边框颜色border-color
  • 11.4.4 边框属性border
  • 11.5 CSS布局理念
  • 11.5.1 将页面用Div分块
  • 11.5.2 设计各块的位置
  • 11.5.3 用CSS定位
  • 第12章 用CSS定位控制网页布局
  • 12.1 position定位
  • 12.1.1绝对定位absolute
  • 12.1.2固定定位fixed
  • 12.1.3相对定位relative
  • 12.2 浮动定位
  • 12.2.1 float属性
  • 12.2.2 浮动布局的新问题
  • 12.2.3 清除浮动clear
  • 12.3 定位层叠
  • 12.3.1 层叠顺序
  • 12.3.2简单嵌套元素中的层叠定位
  • 12.3.3含子元素的复杂层叠定位
  • 12.4 常见布局类型
  • 12.4.1一列固定宽度
  • 12.4.2 一列自适应
  • 12.4.3 两列固定宽度
  • 12.4.4两列宽度自适应
  • 12.4.5两列右列宽度自适应
  • 12.4.6 三列浮动中间宽度自适应
  • 12.5 实例应用
  • 12.5.1带有边框和边界的图像浮动于文本右侧
  • 12.5.2创建菜单
  • 第13章 移动网页设计基础CSS3
  • 13.1 边框
  • 13.1.1 圆角边框 border-radius
  • 13.1.2 边框图片border-image
  • 13.1.3 边框阴影box-shadow
  • 13.2背景
  • 13.2.1 背景图片尺background-size
  • 13.2.2背景图片定位区域background-origin
  • 13.2.3 背景绘制区域background-clip
  • 13.3文本
  • 13.3.1 文本阴影text-shadow
  • 13.3.2 强制换行word-wrap
  • 13.3.3 文本溢出text-overflow
  • 13.3.4 文字描边text-stroke
  • 13.3.5 文本填充颜色text-fill-color
  • 13.4 多列
  • 13.4.1 创建多列column-count
  • 13.4.2 列的宽度column-width
  • 13.4.3列的间隔column-gap
  • 13.4.4 列的规则column-rule
  • 13.5 转换
  • 13.5.1 移动translate()
  • 13.5.2 旋转rotate()
  • 13.5.3 缩放scale()
  • 13.5.4 扭曲skew()
  • 13.5.5 矩阵matrix()
  • 13.6 过渡
  • 13.7 动画
  • 13.7.1 @keyframes 规则声明动画
  • 13.7.2 animation使用动画
  • 13.8用户界面
  • 13.8.1 Box Sizing
  • 13.8.2 resize
  • 13.8.3 Outline Offset
  • 13.9 实例应用
  • 13.9.1鼠标放上去显示全部内容
  • 13.9.2美观的图片排列
  • 第14章 CSS与JavaScript应用
  • 14.1 JavaScript概述
  • 14.1.1 JavaScript简介
  • 14.1.2 JavaScript放置位置
  • 14.2 JavaScript基本语法
  • 14.2.1 变量
  • 14.2.2 数据类型
  • 14.2.3 表达式和运算符
  • 14.2.4 函数
  • 14.2.5注释
  • 14.3 JavaScript程序语句
  • 14.3.1 if…else语句
  • 14.3.2 for语句
  • 14.3.3 switch语句
  • 14.3.4 while循环
  • 14.3.5 break语句
  • 14.3.6 continue语句
  • 14.4 JavaScript的事件
  • 14.4.1 onClick事件
  • 14.4.2 onchange事件
  • 14.4.3 onSelect事件
  • 14.4.4 onFocus事件
  • 14.4.5 onLoad事件
  • 14.4.6 onUnload事件
  • 14.4.7 onBlur事件
  • 14.4.8 onMouseOver事件
  • 14.4.9 onMouseOut事件
  • 14.4.10 onDblClick事件
  • 14.4.11 其他常用事件
  • 14.5 浏览器的内部对象
  • 14.5.1 navigator对象
  • 14.5.2 document对象
  • 14.5.3 windows对象
  • 14.5.4 location对象
  • 14.5.5 history对象
  • 14.6 实例应用
  • 14.6.1 显示当前时间
  • 14.6.2 当鼠标指针经过图像时图像震动效果
  • 14.6.3 自动切换图像
  • 第15章 企业设计
  • 15.1企业设计概述
  • 15.1.1 企业分类
  • 15.1.2 企业能栏目
  • 15.2 内容分析
  • 15.3 HTML结构设计
  • 15.4 方案设计
  • 15.5 定义整体样式
  • 15.6 制作页面顶部
  • 15.6.1 页面顶部的结构
  • 15.6.2 定义页面顶部的样式
  • 15.7 制作左侧导航
  • 15.7.1 制作左侧导航部分的结构
  • 15.7.2 定义左侧导航的样式
  • 15.8 制作联系我们部分
  • 15.8.1 联系我们部分的结构
  • 15.8.2 定义联系我们内容的样式
  • 15.9 制作企业介绍部分
  • 15.9.1 制作企业介绍部分结构
  • 15.9.2 定义企业介绍部分的样式
  • 15.10 制作图片展示和新闻动态
  • 15.10.1 制作页面结构
  • 15.10.2 定义页面样式
  • 15.11 制作订购部分
  • 15.11.1 制作页面结构
  • 15.11.2 定义样式
  • 15.12 制作底部部分
  • 15.13 的上传
  • 第16章 移动设计
  • 16.1 移动设计概述
  • 16.1.1 什么是移动设计
  • 16.1.2移动设计的原则
  • 16.1.3怎样开始移动网页设计
  • 16.2移动网页设计的注意事项
  • 16.3 制作页面
  • 16.3.1 网页HTML整体结构
  • 16.3.2 新建手机网页
  • 16.3.3 新建CSS样式表
  • 16.3.4 制作header部分
  • 16.3.5 制作about部分
  • 16.3.6 制作工程案例部分
  • 16.3.7 制作设计师部分
  • 16.3.8 制作联系我们部分
  • 16.3.9 制作底部部分
  • 16.4维护
  • 16.5 的推广
  • 16.5.1 登录搜索引擎
  • 16.5.2 交换广告条
  • 16.5.3 登录网址导航站点
  • 16.5.4 通过BBS宣传
  • 16.5.5 聊天工具推广
  • 16.5.6 使用传统方式推广
  • 16.5.7 使用传统方式推广
  • 附录 CSS浏览器兼容性与常见技巧解答
  • 问题1.上下margin重合
  • 问题2. margin加倍的问题
  • 问题3.浮动IE产生的双倍距离
  • 问题4.超链接访问后hover样式不出现
  • 问题5. IE6对png的透明度支持问题
  • 问题6.行内元素上下margin及ping不拉开元素间距
  • 问题7. 浮动背景
  • 问题8. 如何正确对齐文本
  • 问题9. 超链接访问过后hover样式就不出现的问题
  • 问题10. list-style-image无法准确定位的问题
  • 问题11. 如何垂直居中文本
  • 问题12. 为什么无法定义1px左右高度的容器
  • 问题13. 怎样使一个层垂直居中于浏览器中
  • 问题14. 能给某部分内容加边框吗
  • 问题15. 如何去掉下划线
  • 问题16. 如何垂直居中文本
  • 问题17. 如何让div横向排列
  • 问题18. 怎样设置滚动条颜色
  • 问题19.字体大小定义不同
  • 问题20.innerText在IE中能正常工作,但在FireFox中却不行。
  • 问题21.ul和ol列表问题
  • 问题22.IE与宽度和高度的问题
  • 问题23.DIV浮动IE文本产生3象素的bug

资源下载

资源下载地址1:https://box.lenovo.com/l/DJhM2c

相关资源

网友留言

网友NO.46411
江阳文

一直断断续续的学习,看书评说这本书很适合零基础的人。拿来梳理梳理自己的技能,不错滴

网友NO.26072
郑嘉怡

书名是从入门到精通应该改为入门,仅此而已

这本书价格挺贵的,华而不实。

适合没有任何基础的人看,从基础的html到基本的表格、css的最基础知识都有