【BS学习】精通CSS.DIV网页样式与布局总结

第一课 初探CSS

1.1 CSS的概念

CSS：层叠样式表，用于控制网页样式并允许将样式信息与网页内容分离的一种标记性语言。

标记的概念

HTML的缺陷

CSS的引入

 

1.2使用CSS控制页面

1.2.1行内样式

1.2.2内嵌式

1.2.3链接式

1.2.4导入样式

 

 

第二课 CSS基本语法

2.1 CSS选择器

2.1.1标记选择器

 

2.1.2 类别选择器

 

2.1.3 ID选择器

 

2.2选择器声明

2.2.1 集体声明

2.2.2 选择器的嵌套

2.3 CSS的继承

2.3.1 父子关系

2.3.2 CSS继承的运用

 

 

第三课 CSS文字效果

3.1 CSS文字样式

3.1.1 文字

3.1.2 文字大小

3.1.3 文字颜色

 

3.1.4 文字粗细

3.1.5 斜体

3.1.6 下划线、顶划线、删除线

3.1.7 英文字母大小写

 

3.2文字实例：模拟Google公司logo

 

3.3 CSS段落文字

3.3.1 段落水平对齐方式

3.3.2 段落垂直对齐方式

3.3.3 行间距、字间距

3.3.4 首字放大

3.4 段落实例：百度搜索

 

第四课 CSS图片

4.1 图片样式

4.1.1 图片边框

4.1.2 图片缩放

4.2  图片对齐

4.2.1 横向对齐

4.2.2 纵向对齐

4.3 图文混排

4.3.1 文字环绕

4.3.2 设置图片与文字的间距

4.4图文实例：八仙过海

 

第五课 CSS页面背景

5.1 背景颜色

5.1.1 页面背景色

5.1.2 用背景色给页面分块

5.2 背景图片

5.2.1 页面的背景图

5.2.2 背景图片的重复

5.2.3 背景图片的位置

5.2.4 固定背景图片

5.3 古词《念奴娇*赤壁怀古》

 

第六课 CSS设置表格和表单样式

6.1控制表格

6.1.1 表格中的标记

6.1.2 表格的颜色

6.1.3 表格的边框

6.2表格实例一：隔行变色

 

6.3 CSS与表单

6.3.1 表单中的元素

6.3.2 像文字一样的按钮

6.4 直接属入的Excel表格

 

第七课 页面和浏览器元素

7.1丰富的超链接特效

7.1.1 动态超链接

7.1.2 按钮式超链接

7.1.3 浮雕式超链接

7.2 鼠标特效

7.2.1 CSS控制鼠标箭头

7.3 页面滚动条

 

第八课 CSS制作使用菜单

8.1 项目列表

8.1.1 列表的符号

8.1.2 图片符号

8.2 无需表格的菜单

 

8.3 菜单的横竖转换

 

8.4 流行的Tab菜单

 

第九课 CSS滤镜的使用

9.1 滤镜概述

 

9.2 ~9.7滤镜实例

9.2 Aloha通道

9.3 Blur模糊

9.4 透明色

 

9.5 Flip翻转

 

9.6 遮罩

 

9.7 波浪

 

第十课 理解CSS与DIV定位

10.1 div与span标记

10.1.1 概述

10.1.2 div与span的区别

10.2 盒子模型

10.2.1 盒子模型的概念

 

10.2.2 border

10.2.3 padding

10.2.4 margin

 

10.3 元素的定位

10.3.1 float定位

10.3.2 position

 

10.4 给图片签名

 

第十一课 CSS排版观念

11.1 CSS排版观念

11.1.1 将页面用div分块

11.1.2 设计各块的位置

11.1.3 用CSS定位

 

 

 

11.2 固定宽度且居中的版式

11.2.1 方法一

11.2.2 方法二

 

 

11.3 排版实例：电子相册

 

 

 

 

第十二课 网页变幻

12.1 框架搭建

12.2 实例一：蓝色经典

 

12.3 实例二：清明上河图

12.4 实例三：交河故城

12.5 自动选择CSS样式

 

 

第十三课 CSS与JavaScript

13.1 JavaScript概述

13.1.1 JavaScript简介

13.1.2 数据类型和变量

string字符串、数值、Boolean、undefined、null、Object

 

13.1.3 表达式及运算符

 

13.2 JavaScript语法基础

13.3 实例一：输入时高亮的Excel表格

13.4 实例二：由远到近的文字

13.5 实例三：图片淡入淡出

 

第十四课 CSS与XML综合运用

14.1 XML基础

14.1.1 XML基本语法

14.2 XML链接CSS文件

14.3 XML文字阴影效果

14.4 XML古诗字画

 

第十五课 CSS与AJAX综合运用

15.1 Ajax概述

15.1.1 什么是Ajax

Google map

Gmail

15.1.2 Ajax关键元素

JavaScript、css、DOM、XMLHttpRequest

15.1.3 CSS重要地位

Google moon

源码展示

15.2 Ajax入门

 

15.3 能够自由拖动布局区域的网页

 

第十六课 我的博客

16.1 分析架构

16.1.1 设计分析

16.1.2 排版构架

16.2 模块拆分

16.2.1 导航与banner

16.2.2 左侧列表

16.2.3 内部内容

16.2.4 footer脚注

16.3 整体调整

 

第十七课 小型工作室

17.1 分析构架

17.1.1 设计分析

17.1.2 首页排版

17.1.3 内容页构架

17.2  模块划分

17.2.1 搭建首页

17.2.2 首页图片

17.2.3 内容页面

17.2.4 footer脚注

17.3 整体调整

 

第十八课 公司网站

18.1 分析构架

18.1.1 设计分析

18.1.2 排版构架

18.2 模块拆分

18.2.1 logo与顶端链接

18.2.2 左侧导航与搜索

18.2.3 主体内容

18.2.4 内容banner

18.2.5 新闻快递

18.2.6 公司咨询

18.2.7 英文刊物

 

18.3 整体调整

 

第十九课 网上购物

19.1 分析构架

19.1.1 设计分析

19.1.2 排版构架

19.2 模块分析

19.2.1 banner图片

19.2.2 导航菜单

19.2.3 鲜花导购

19.2.4 主体内容

19.3 整体调整

 

第二十课 旅游观光

20.1 分析构架

20.1.1 设计分析

20.1.2 排版构架

20.2 模块拆分

20.2.1 banner图片与导航菜单

20.2.2 左侧分栏

20.2.3 中部主体

20.2.4 右侧分栏

20.2.5 footer脚注

20.3 整体调整