网页设计 HTML简介 - 360文档中心

合集下载

相关主题

html网页设计基础

1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。

Client
使用HTTP（超文本传输协议）工作
二、HTML简介及基本结构
HTML文档的定义和作用
HTML是HyperText Markup Language的简写，称为超文本标记语言。 HTML并不是一种程序，也不是一个图文混排的排版软件，它只是一种控制网页内容显示的文本类型的标识语言。HTML是纯文本类型的文件，可以使用任何一种文本编辑器进行编写，通过浏览器解释执行。
11、水平线标签
格式：<hr>
作用：换行并在该行下画一条横线，横线上下两端都会留出一定的空白。标签的属性有（size、 width、align、color、noshade），详见下表。
属性 size width
align
color noshade
值数字数字
功能设置粗细设置宽度
Left、center、设置横向对齐方
3、换行标签：格式： 作用：使标签后面的内容从下一行开始显示。
4、强制不换行标签：格式： 作用：把不适于分开的词和短语放在同一行中。
5、分段控制标签：格式： 属性：align（left、center、right）作用：可以区别出文字的不同段落。
第二章 HTML(XHTML)基础
教学目标：
回顾上学期学过的Web站点架设知识，并能够在实际中得到使用。
掌握HTML的概念、结构和用途，初步学会使用 HTML编辑工具。
掌握HTML常用标签的作用及用法。学会实际动手编写第一个自己的HTML页面。
教学重点和难点：
HTML文件基本结构和编写 DW编辑器的基本使用
right
式
颜色代码无
设置颜色
设置不显示3D阴影
单位 Pixel（像素）
默认值 2
Pixel（像素）、 100% 百分比
center
#000000
12、插入图像标签格式：<img> 属性：
src：设置图像存放的位置。 width：设置图像宽度，单位是px 。 height：设置图像高度，单位是px 。 align：设置图像与周边内容的对齐方式，值为left、 right、top、middle、bottom。 alt：设置当鼠标光标移到图像上时显示的提示信息。 border：设置图像的边框线宽度，单位是px 。 vspace：设置图像与周边内容的垂直间距，单位是px 。 hspace：设置图像与周边内容的水平间距，单位是px 。
一、Web站点的运行环境和运行过程
运行环境： 1、服务端需要安装IIS（Internet Information Server）
Internet信息服务器。 2、客户端需要安装浏览器（例如：Internet Explorer 简
称IE ）。 3、运行过程：图示如下。
Server
发送数据到客户端发出请求到服务端
系。
Biblioteka Baidu
三、HTML常用标签
1、标题标签：格式：<title></title> 作用：为浏览器标题栏设置标题。
2、页面的主体标签：格式：<body></body> 属性： text、background、bgcolor、
leftmargin、topmargin。作用：要在浏览器中显示的内容必须放于其中。
* n的取值范围是1～6，值为1时字号最大;值为6 时字号最小。
9、文字格式控制标签：格式：…… 属性：face（宋体、黑体、verdana）、 size（1～7）、color（颜色代码）
*color的值是用六位十六进制表示的，如#000000 表示黑色，#FFFFFF表示白色，每二位表示三颜色RGB（红、绿、蓝）中的一种颜色。
（2）双标签：由首标签和尾标签两部分组成，格式为<标签名称>要控制的内容</标签名称>，仅对包含在其中的文件部分发生作用。
（3）标签属性：在单标签或是双标签的首标签中可以设置一些属性，增强该标签的作用，格式为<标签名称属性1=“值1“ 属性2=“值2“ ……>，尾标签保持原样。
* 属性中的双引号切记不要省略。 * 由标签相互进行嵌套构成整个文档。 * 单、双标签切记不要忽视或是缺省。 * 网页显示的速度与网页代码的质量有很大的关
10、文字修饰标签格式：……（粗体）
……（粗体） ……（斜体） …… （斜体） ……（下划线） <s>……</s>（删除线） ……（上标） ……（下标）
* 文字更多、更强的修饰可以由CSS样式表完成，在后续的CSS样式章节中会进行详细讲解。
6、原样显示文字(预格式化)标签：格式：<pre></pre> 作用：通过浏览器显示时，如果要显示源代
码中排版时的效果，可用原样显示文字标签实现。
7、居中对齐标签：格式：<center></center> 作用：使<center>与</center>之间的内容水平
居中对齐。
8、标题文字标签：格式：<hn>……</hn> 属性：align（left、center、right）
HTML文档基本结构
文件开始文件头区域文件标题
文件体区域
文件结束
文件中可见内容
* 文件头中的内容在浏览器打开时是看不到的，这些内容只是用来设置文件标题和属性的。
* 文件体中的内容在浏览器中是可以看到的，可见部分的代码必须写在<body>……</body>区域中。
HTML文档语法
（1）单标签：格式为<标签名称>，其作用是在相应位置插入标签，例如 标签表示在该标签所在的位置插入一个换行符。注：XHTML中单标签的书写格式为<标签名称 />
13、表格标签
（1）表格的结构： <table> <tr> <td></td> </tr>
</table> （2）表行：<tr></tr> （3）单元格：<td></td> *一个表由<table>开始，</table>结束，表的内容由<tr>
和<td>定义和组成的。<tr>指明了表的一个行，表有多少行就有多少个<tr>；表有多少个“格子”就有多少个<td>。