网页制作基本代码重点讲义资料.docx

网页制作基本代码重点讲义资料.docx

《网页制作基本代码重点讲义资料.docx》由会员分享，可在线阅读，更多相关《网页制作基本代码重点讲义资料.docx（16页珍藏版）》请在冰豆网上搜索。

网页制作基本代码重点讲义资料

复习提纲目录

第1章网页入门

1.1.1网页基本知识

1.什么是网页

由浏览器识别的用于显示信息的文件（信息包括：

新闻、微博、购物、邮件等）

2.什么是网站

由众多网页组成的一个群体（网页之间可以相互调用实现信息查看）

3.构成网页的元素：

文本、图像、动画、表格、其他。

1文本：

用于描述信息的文字

2图像：

增强信息的生动性和直观性

3动画：

强烈视觉冲击效果

4表格：

布局的合理性

5其他：

视频、背景音乐等

4.访问网页的三个要素

→网站的存储空间

⏹服务器用于网页的存放

→网站的域名

⏹通过域名指向需要访问的网页

→网页的访问地址

⏹通过域名访问，通常打开的是默认页面

⏹通过域名+网页名称进行访问

5.Dreamweaver工具的特点

1开发环境完备、简单易用

2所见即所得、支持可视化操作

3代码提示功能

4编写代码边看效果

6.编辑模式

三种编辑模式

1代码模式

2拆分模式

3设计模式

第2章图像与超链接

1、图像的应用场合

1）新闻图片

2）产品说明

3）LOGO设计

4）Banner设计

5）广告宣传

2、图像的作用：

图文并茂、直观、生动

3、图像路径的几种情况：

1）图像与网页在相同的目录下，直接写文件名称

2）图像位于网页目录下的某个子目录，先写子目录名字再写文件名称

3）图像位于网页目录之上，../文件名

4、图像的相关属性

图像的基本属性（图像地址、图像尺寸、可替换的文本）

5、图文混排的属性设置

边距（水平和垂直边距）

对齐方式（左对齐、右对齐、居中对齐）

6、超链接——使相互独立的页面可以互相访问。

……

目标窗口主要有两种：

_blank;（在新窗口中打开）

_self;（在原始窗口打开）

7、超链接的种类

1）电子邮件链接：

mailto:

jone@

代码：

jone@”target=”_blank”>jone

2）书签标记（锚链接）

先“命名锚记”再“创建链接”

代码：

查看公司位置

3）空链接#

4）图像链接

5）文本链接

第3章列表

1、无序列表

—

• 1）

  属于项目列表

  2）列表项之间无顺序之分

  3）每个列表项前均有一个项目符号

  2、无序列表的类型

  通过type属性设置列表显示符号类型

  1）disc：

  实心圆点

  2）square：

  实心方框

  3）circle：

  空心圆点

  3、有序列表

  —

  1. 1）属于项目列表

     2）以数字作为列表项符号

     4、有序列表的类型

     1）1：

     数字

     2）A：

     大写英文

     3）a：

     小写英文

     4）i：

     小写罗马字符

     5）I：

     大写罗马字符

     5、定义列表

     —

     —

     →用于具有特殊要求的列表显示

     第4章网页中的表格

     1、表格的作用

     →页面布局整齐、美观

     2、表格的基本结构

     →单元格:

     表格的最小单位

     →行:

     一个或多个单元格横向堆叠形成了行

     →列:

     一个或多个单元格纵向划分形成了列

     3、表格的属性

     宽度边框对齐方式单元格的填充

     间距

     “填充”效果“间距”效果

     4、表格的行列关系

     →表格由行列组成

     →一行可以包含多列

     →列由一个或多个单元格组成

     5、单元格的属性

     宽高背景色水平对齐垂直对齐

     ……

     跨行跨列

     注意：

     水平对齐（left、right、center）

     垂直对齐（top、middle、bottom、baseline）

     第5章网页中的表单

     1、表单的典型应用

     →登陆

     →注册

     →网上购物

     →

     问卷填写

     →搜索信息

     2、表单的属性

     →表单ID

     →动作

     →方法

     代码：

     3、表单的主要元素

     1）单行文本框（元素名称、字符宽度、最多字符数、初始值）

     2）密码框

     3）单选按钮

     4）复选框

     5）下拉列表

     1997

     1998

     1999

     6）按钮

     按钮的类型（提交按钮、重置按钮、普通按钮）

     7）文件域

     8）隐藏域

     9）多行文本域

     4、设置表单元素的功能属性

     →只读属性：

     readonly

     →禁用属性：

     disabled

     第7章使用CSS样式美化网页

     1、什么是CSS

     →CSS：

     CascadingStyleSheets层叠样式表

     →用于确定网页格式控制的规则

     2、CSS的作用

     →内容和样式的分离

     →样式复用

     →页面的精确控制

     →搜索引擎的收录

     3、Dreamweaver与CSS样式

     1）标签导航器

     →通过标签可以快速定位需要设置样式的位置

     2）CSS选择器

     →标签选择器：

     以标签名作为样式名称

     →类选择器:

     以“.选择器名称”来表示样式，能实现套用

     →ID选择器：

     以元素id作为样式名

     3）CSS属性面板

     →CSS规则

     →编辑规则

     4、字体样式

     字体修饰的内容

     属性名称

     说明

     font-family

     字体名称

     font-size

     字体大小

     color

     字体颜色

     line-height

     行高

     5、文本对齐方式的设置

     →属性：

     text-align

     →方式：

     left、center、right

     6、样式表修饰背景

     背景修饰的内容

     属性名称

     说明

     background-color

     背景颜色

     background-image

     背景图像地址

     background-repeat

     背景图像平铺属性

     background-position

     背景图像位置

     第9章HTML总结

     1、常用的HTML标签

     名称

     说明

     HTML的基本标签，所有的HTML内容都是放在该标签中的

     HTML文档的头部，一般用于定义网页的全局属性，如标题、网页编码等