登录免费注册



网页设计与制作教程

首页  思维导图  详情



网页设计与制作教程

2024-12-05 11:27:45   0  举报





仅支持查看

AI智能生成

网页设计与制作教程

网页设计与制作教程

模版推荐

作者其他创作

大纲/内容

第一章网页制作的基础知识

1.1认识网页和网站

1.1.1网页、网站

1.1.2 静态网页和动态网页

1.2 网页的基本构成元素

1.2.1文本

1.2.2.图片和动画

1.2.3.超链接

1.2.4.音频视频

1.2.5.交互表单

1.2.6.其他常见元素

1.3 页面布局结构

1.3.1 网页页面布局

1.3.2 网页色彩搭配

1.4    Web前端技术简介

1.4.1 初识WEB前端

1.4.2 WEB前端开发的三大核心技术

1.4.3 前端开发工具

1.5HTML语法基础

1.5.1GTML概述

1.5.2HTML基本结构

1.6创建HTML文档

1.7网页头部标签

1.7.1<title>标签

1.7.2<meta>标签

1.7.3<link>标签

1.7.4<script>标签

1.8HTML5文档注释和特殊符号

1.8.1注释

1.8.2特殊符号

1.9综合案例——临江仙.送钱穆父

第二章网页制作的排版方法

2.1文字与段落排版

2.1.1段落标签

2.1.2标题标签

2.1.3换行标签

2.1.4水平线标签

2.1.5预格式化标签

2.1.6缩排标签

2.2超链接

2.2.1超链接简介

2.2.2超链接的应用

2.3图像

2.3.1网页图像的格式及使用要点

2.3.2图像标签

2.3.3图像超链接

2.3.4设置网页背景图像

2.3.5图文混排

2.4列表

2.4.1无序列表

2.4.2有序列表

2.4.3定义列表

2.4.4嵌套列表

2.5综合案例——无线吸尘器

第三章表格布局与表单交互

3.1表格概述

3.1.1表格的结构

3.1.2表格的基本语法

3.2表格属性设置

3.2.1表格边框属性

3.2.2表格的宽度和高度属性

3.2.3背景颜色与表格图像属性

3.2.4表格边框样式属性

3.2.5单元格间距、单元格边距属性

3.2.6表格的水平对齐属性

3.2.7设置表格的（tr）标记行的属性

3.2.8设置单元格的属性

3.2.9单元格跨行跨列

3.3表格嵌套

3.4表单

3.5案例

第四章CSS样式基础

4.1CSS概述

4.1.1CSS的基本概述

4.1.2传统HTML的缺点

4.1.2.1维护困难

4.1.2.2标记不足

4.1.2.3网页过“胖”

4.1.2.4定位困难

4.1.3CSS的特点和优势

4.1.3.1表现和内容分离

4.1.3.2增强了网页的表现力

4.1.3.3使整个网站显示风格趋于统一

4.1.4CSS的编写规则

4.1.4.1目录结构命名规则

4.1.4.2样式文件的命名规则

4.1.4.3选择器的命名规则

4.1.4.4CSS代码注释

4.1.4.5CSS代码缩进

4.2CSS语法基础

4.2.1CSS基本语法

4.2.1.1基本语法

4.2.1.2.语法说明

4.2.2.CSS选择器类型

4.2.2.1.标记选择器

4.2.2.2.class选择器

4.2.2.3.ID选择器

4.2.2.4.伪类选择器

4.2.3.CSS选择器声明

4.2.3.1.集体生明

4.2.3.2.全局声明

4.2.3.3派生选择器（上下文选择器

4.3CSS引入方式

4.3.1.内联样式表（行内样式表）

4.3.1.1.基本语法

4.3.1.2.语法说明

4.3.2.内部样式表

4.3.2.1.基本语法

4.3.2.2.语法说明

4.3.3.外部样式表

4.3.3.1.链接外部样式表

4.3.3.2.导入外部样式表

4.4 CSS的属性单位

4.4.1.长度、百分比单位

4.4.1.1.相对类型

4.4.1.2.绝对类型

4.4.2.色彩单位

4.4.2.1.用十六进制数方式表示色彩值

4.4.2.2.用色彩名称方式表示色彩值

4.4.2.3.使用RGB（x,y,z）函数表示

4.5.CSS继承与层叠

4.6 元素类型

4.6.1.块级元素

4.6.2.行级元素

4.6.3.列表项元素

4.6.4.隐藏元素

4.7综合案例

第五章 CSS盒模型

5.1盒模型的定义

5.2.1 盒模型的宽度

盒模型的高度

边距设置和边框设置

外边距设

右外边距

上外边距置

下外边距

左外边距

外边距

外边距的合并

行级元素外边距合并

内边距设置

块级元素外边距合并

边框设置

上边框

右边框

下边框

左边框

边框样式

边框宽度

边框颜色

新增边框属性

圆角边框

阴影边框

图片绘制边框

CSS元素的定位

static 定位

relative定位

absolute定位

相对浏览器绝对定位

相对父盒子绝对定位

fixed定位

CSS元素的浮动

盒子的浮动添加

盒子的浮动清除

综合案例——昵心美食空间

第六章元素应用CSS

使用CSS设置字体样式

字体类型

字体大小e

字体粗细

字体倾斜

使用CSS设置文本样式

文本水平对齐方式

行高

文本的修饰

段落首行缩进

首字下沉

字符间距

文本的截断

文本的颜色

文本的背景颜色

使用CSS设置图像样式

设置图像边框

图像缩放

.设置背景图像

设置背景重复

背景图像定位

使用关键字进行背景定位

使用长度进行背景定位

使用百分比进行背景定位

使用CSS设置表单样式

使用CSS修饰常用的表单元素

修饰文本域

修饰按钮

制作登录表单

综合案例——商城的注册页面

第七章利用CSS和多媒体美化页面

CSS链接的美化

文字链接的美化

按钮链接的美化

背景链接的美化

CSS列表的美化

列表项类型（list-style-type）

列表项图像（list-style-image

列表项位置（list-style-position

复合列表样式（list-style

利用背景图像实现列表项标记

CSS表格的美化

border-collapse

border-spacing

caption-side

.empty-cells

多媒体的添加与美化

.<embed>标签的使用

<bgsound>标签的使用

HTML5新增的多媒体标签

<video>标签

<audio>标签

综合案例——海洋旅游胜地

第八章利用CSS制作导航栏

水平顶部导航栏

简单水平导航栏的设计与实现<br>

导航栏的创建

列表样式的设计

超链接样式的设计

鼠标事件

下拉子菜单导航栏的设计与实现

导航栏的创建

列表样式的设计

二级菜单的隐藏和显示设计

DIV样式的设计

超链接样式的设计

鼠标事件

纵向侧边导航栏

简单纵向导航栏的设计与实现

导航栏的创建

列表样式的设计

超链接样式的设计

出式子菜单导航栏的设计与实现

导航栏的创建

DIV样式的设计

二级菜单的隐藏和显示设计

列表样式的设计

超链接样式的设计

底部固定导航栏

导航栏的创建

列表样式的设计

菜单固定底部的设计

超链接样式的设计

鼠标事件

综合案例——优名养生馆

第九章 DIV+CSS布局

DIV+CSS概述

认识DIV

DIV的宽高设置

宽高属性

div标签内直接设置宽高

div使用选择器设置宽高

div高度的百分比设置问题

DIV+CSS的应用

DIV元素的布局技巧

DIV元素的宽度自适应

DIV内容的居中

DIV元素的嵌套

DIV+CSS的典型布局

左中右布局

上中下布局

混合布局

综合案例——众成远程教育

第十章 JavaScript的应用<br>

JavaScript概述

JavaScript简介

简单性

动态性

跨平台性

安全性

基于对象的语言

JavaScript入门案例

JavaScript放置的位置

head标记中的脚本

body标记中的脚本

外部js文件中的脚本

事件处理代码中的脚本

JavaScript语法

语法基础

区分大小写

变量不区分类型

每行代码结尾可以省略分号

注释与C、C++、Java等语言相同

标识符和常用变量

标识符

变量声明

变量类型

运算符与表达式

算术运算符和表达式

关系运算符和表达式

逻辑运算符和表达式

赋值运算符和表达式

条件运算符和表达式

逗号运算符和表达式

程序设计

条件分支语句

循环语句

函数

定义函数<br>

函数返回值

函数调用

JavaScript对象

对象基础

概述

属性

方法

常用对象

window对象

document对象

location对象

navigator对象

JavaScript事件

事件及事件处理

常用事件

事件应用举例

综合案例——轮播广告

 Collect

Get Started

网页设计与制作教程

DreamweaverCC网页设计与制作标准教程

 Collect

Get Started

DreamweaverCC网页设计与制作标准教程

 Collect

Get Started

网页设计与制作教程

 Collect

Get Started

网页设计与制作教程













评论

0 条评论

下一页



图形选择

思维导图

主题

补充说明

AI生成





修改AI描述

去编辑

重新生成

提示 

关闭后当前内容将不会保存，是否继续？

取消

确定

Document