封面
版权信息
内容提要
编委会
前言
第1章 Bootstrap概述
1.1 Bootstrap简述
1.2 为何使用Bootstrap
1.3 如何使用Bootstrap
1.4 下载Bootstrap
1.5 简单模板
1.6 案例:Bootstrap实例
本章小结
实训项目
第2章 栅格系统
2.1 实现原理
2.2 工作原理
2.3 使用方法
2.3.1 基本用法
2.3.2 混合与匹配
2.3.3 等宽列
2.3.4 可变宽度内容
2.3.5 列偏移
2.3.6 列排序
2.3.7 列嵌套
2.4 结合其他工具类使用
2.4.1 排列
2.4.2 无边距类
2.4.3 居左/居右
2.5 案例:W3school首页
本章小结
实训项目:制作银行网站首页
第3章 CSS布局
3.1 排版
3.1.1 标题
3.1.2 段落
3.1.3 内联文本标签
3.1.4 文本类
3.1.5 缩略语
3.1.6 地址
3.1.7 引用
3.2 列表
3.2.1 无序列表和有序列表
3.2.2 无样式列表
3.2.3 内联列表
3.2.4 描述列表
3.3 代码
3.4 表格
3.4.1 基本表格
3.4.2 斑马线表格
3.4.3 表格的边框
3.4.4 鼠标悬停高亮行
3.4.5 紧凑型表格
3.4.6 响应式表格
3.4.7 颜色反转表格
3.4.8 表头类
3.4.9 状态类
3.5 按钮
3.5.1 预定义按钮
3.5.2 按钮标签
3.5.3 按钮边框
3.5.4 按钮尺寸
3.5.5 块级按钮
3.5.6 按钮激活状态
3.5.7 按钮禁用状态
3.6 图像
3.6.1 响应式图像
3.6.2 图像样式
3.6.3 图像对齐
3.6.4 picture元素
3.7 图文框
3.8 案例:少儿编程网站首页
本章小结
实训项目:“动物世界”百度词条网页
第4章 工具类
4.1 颜色
4.2 边框
4.2.1 基本边框
4.2.2 边框的颜色
4.2.3 边框的圆角
4.3 关闭按钮
4.4 浮动
4.4.1 浮动
4.4.2 清除浮动
4.5 边距
4.6 尺寸
4.6.1 宽度
4.6.2 高度
4.6.3 最大宽度高度
4.7 定义display
4.8 flex布局
4.8.1 display属性
4.8.2 flex-flow属性
4.8.3 justify-content属性
4.8.4 align-items属性
4.8.5 align-self属性
4.8.6 order属性
4.8.7 flex-grow和flex-shrink属性
4.8.8 .flex-fill类
4.8.9 自动外边距
4.9 嵌入
4.10 定位
4.11 阴影
4.12 垂直对齐
4.13 可见性
4.14 溢出
4.15 图像替换
4.16 屏幕阅读器
4.17 案例:学习电台页面
本章小结
实训项目:个人简历网页
第5章 表单
5.1 基础表单
5.1.1 垂直表单
5.1.2 内联表单
5.1.3 水平表单
5.2 表单控件
5.2.1 输入框
5.2.2 下拉框
5.2.3 文本域
5.2.4 单选按钮和复选框
5.3 表单焦点
5.4 表单禁用
5.5 元素大小
5.5.1 高度
5.5.2 宽度
5.6 自定义表单
5.7 表单验证
5.8 输入框组
5.9 案例:创建“注册新账号”页面
本章小结
实训项目:表单部分
第6章 CSS组件
6.1 下拉菜单
6.1.1 基本用法
6.1.2 分割线
6.1.3 菜单标题
6.1.4 对齐方式
6.1.5 禁用菜单项
6.2 导航
6.2.1 导航基础样式
6.2.2 选项卡导航
6.2.3 Pills导航
6.2.4 垂直导航
6.2.5 导航禁用状态
6.2.6 导航对齐方式
6.2.7 导航二级菜单
6.2.8 面包屑导航
6.3 导航条
6.3.1 导航条的基本用法
6.3.2 品牌图标
6.3.3 导航条上的链接
6.3.4 导航条上的表单
6.3.5 导航条上的文本
6.3.6 导航条中的二级菜单
6.3.7 固定导航条
6.3.8 导航条配色方案
6.4 分页导航
6.5 徽章
6.6 卡片
6.6.1 基本卡片
6.6.2 卡片的内容设计
6.6.3 卡片的页眉和脚注
6.6.4 卡片样式
6.6.5 水平卡片
6.6.6 卡片组
6.6.7 卡片布局
6.7 进度条
6.7.1 基础进度条
6.7.2 进度条的颜色
6.7.3 条纹进度条
6.7.4 进度条堆叠效果
6.8 列表组
6.8.1 基础列表组
6.8.2 带徽章的列表组
6.8.3 链接列表组
6.8.4 状态设置
6.8.5 列表组主题
6.8.6 其他元素的支持
6.9 媒体对象
6.9.1 基本构成
6.9.2 对齐方式
6.9.3 嵌套对象
6.9.4 媒体列表组
6.10 巨幕
6.11 旋转图标
6.12 图标
6.12.1 图标的安装
6.12.2 什么是SVG
6.12.3 图标的使用
6.13 按钮组
6.13.1 基本按钮组
6.13.2 按钮工具栏
6.13.3 尺寸
6.13.4 嵌套
6.13.5 垂直的按钮组
6.13.6 分裂式按钮下拉菜单
6.14 案例:保护野生动物网站页面
本章小结
实训项目:制作个人简历网页页面
第7章 JavaScript插件
7.1 插件库说明
7.2 模态框
7.2.1 基本结构
7.2.2 模态框的特点
7.2.3 过渡效果
7.2.4 data-*属性
7.2.5 JavaScript触发
7.2.6 事件
7.3 下拉菜单
7.3.1 声明式触发
7.3.2 JavaScript触发
7.3.3 事件
7.4 滚动监听
7.4.1 组件说明
7.4.2 声明式触发
7.4.3 JavaScript触发
7.5 工具提示框
7.5.1 基本结构
7.5.2 JavaScript触发
7.5.3 data-*属性
7.5.4 事件
7.6 弹出框
7.6.1 基本结构
7.6.2 JavaScript触发
7.6.3 data-*属性
7.6.4 事件
7.7 警告框
7.7.1 基本结构
7.7.2 声明式触发
7.7.3 JavaScript触发
7.7.4 事件
7.8 轮播
7.8.1 基本结构
7.8.2 声明式触发
7.8.3 JavaScript触发
7.8.4 事件
7.9 按钮
7.9.1 状态切换
7.9.2 单选按钮
7.9.3 复选框
7.9.4 方法
7.10 折叠
7.10.1 声明式触发
7.10.2 JavaScript触发
7.10.3 事件
7.11 选项卡
7.11.1 声明式触发
7.11.2 JavaScript触发
7.11.3 过渡效果
7.11.4 事件
7.12 轻量弹框
7.12.1 基本结构
7.12.2 轻量弹框的特点
7.12.3 JavaScript触发
7.12.4 事件
7.13 案例:学院网站首页
本章小结
实训项目:公司网站首页
第8章 综合案例
8.1 网站概述
8.2 开始页面
8.3 主要内容的制作
8.3.1 制作第1屏
8.3.2 制作第2屏
8.3.3 制作第3屏
8.3.4 制作第4屏
8.4 完善网站功能
8.4.1 添加地图
8.4.2 添加导航条
8.4.3 设置页脚
8.4.4 设置滚动监听
8.4.5 平滑滚动
本章小结
实训项目:一个商业网站
附录A Sass
A.1 Sass概述
A.2 Sass插件安装
A.3 Sass的基本语法
附录B CSS选择器
参考文献
更新时间:2025-02-08 17:19:26