一  Html简介
Html全称Hyper Text Markup Language(超文本标记语言的所写),他是全球广域网上描述网页内容和外观的标准，它通过浏览器翻译，将网页中所要呈现的内容展现在用户面前。
发展历史
最初的html以纯文本格式为基础，可以用任何编辑器和文字处理器来为网络创建和转换文本，仅有不多的几个标签。网络迅猛发展，人们开始在网络上发布信息，很快人们开始琢磨在网上放置图像和图标。发展为超文本标记语言。1993出现了第一个图文浏览器，web迅速发展，出现了很多html版本，出于这个混乱局面的考虑，w3c的html working group组织编写了新的规范，从此html3.2开始，它更接近于现实目标，即提供给内容商和浏览器发展在研究工作中一个公允的参考标准。
HTML的结构概念
一个完整的HTML文件包括标题、段落、列表、表格以及各种嵌入对象，这些对象统称为HTML元素。在HTML中适用标签来分割并描述这些元素。实际上可以说，HTML文件就是由
各种HTML元素和标签组成的。一个HTML文件的基本结构如下：
<html>
<head><title></title></ head >
<body></ body >
< /html>
从上面的代码结构可以看出，html的构成主要是通过各种标记来标示和排列各对象，通常由<>以及其中所包容的标记元素组成。
标记的规范：
1. 成对出现，标记可以嵌套，也可以放置各种属性；
2. 不区分大小写；
3. 注释 <!—注释内容-->
Html定义了3种标记用于描述页面的整体结构，不影响页面的显示效果，用来帮助html工具对html文件进行解释和过滤。
<html>
<head></ head >
<body></ body >
< /html >
二  Html基本标签
1.头部标记--<head>
在头元素中，一般需要包括标题，基底信息，元信息。Css和javascript都是定义在头元素中，定义的头元素中的内容不会在网页上直接显示出来。
1. 标题--<title>
2. 元信息标记--<meta>
Meta元素提供的信息是用户不可见的，它不显示在页面中，一般用来定义页面信息的名称，关键字，作者等。Meta不需要设置关闭标记，在一个<>中就是一个meta内容，一个hmtl可以有多个meta元素。
属性：name和http-equiv
      Name主要用于描述网页，便于搜索引擎查
<meta name=”keyword” content=”具体关键字”  />
向搜索引擎说明这一网页的关键字，从而帮助搜索引擎对该网页进行查，分类，可以提高背搜索到的几率，一般可不只设置一个关键字。之间用逗号隔开。
<meta name=”description” content=”对页面的描述语言”  />
便于搜索引擎的查，用来描述网页的主题，于关键字一样。
<meta name=”generator” content=”编辑软件的名称”  />
<meta name=”author” content=”作者的名称”  />
<meta http-equiv=”language” content=”语言”  />
<meta http-equiv=”content-type” content=”text/html;charset=字符集类型”  />
2.页面主体标记--< Body >
Bgcolor 设置背景
Background 设置背景图像
Text 设置文字颜
Link 设置链接文字的颜
Alink 正在访问链接的文字颜
Vlink  访问过后的文字颜
Margin（边距）  设置页面内容于浏览器边框之间的距离（leftmargin，topmargin。。。）
三  文字与段落
一.标题文字的建立
1标题文字的标记    3.1标题文字.html
<h1><h1/>1级标题；
<h2><h2/>2级标题；
<h3><h3/>3级标题；
<h4><h4/>4级标题；
<h5><h5/>5级标题；
<h6><h6/>6级标题；
2.对齐方式—align    3.12标题对齐方式.html
<h1 align=left></h1>
二．文字格式标记 
1.设置字体—face  3.21字体.html
2.设置字号—size
3.设置颜—color
以上三个属性一定要放在<font></font>标签里面。
4.粗体，斜体，下划线—<strong>，<em>，<u>  3.22文字样式.html
5.上标，下标—<sup>，<sub>
6.删除线—<strike>或<s>
7.空格-- ；
          <--<
          >-->
三．段落标记  3.3段落标记.html
段落标记--<p>,可以没有</p>，每一个新的段落开始意味着上一个段落的结束
换行标记—<br>
居中对齐标记--<center>
水平线--<hr width size color align>  3.32水平线.html
四 列表
列表是一种非常实用的数据排列方式，它以条列式的模式来显示数据，使读者能够一目了然。Html中有5种列表，分别是有序列表，无序列表，定义列表 ，菜单列表，目录列表。  4列表.html
一． css设置文字垂直居中无序列表：是一种不编号的列表方式，在每个项目钱，以符号作为分项标识
1.<ul>
<li>第一项</li>
<li>第二项</li>
<li>第二项</li>
</ul>
2.设置无序列表符号类型--type
    Disc—实心圆（默认）
    Circle-空心圆
    Square-方块
二． 有序列表：采用数字或字母作为顺序号
1.<ol>
<li>第一项</li>
<li>第二项</li>
<li>第二项</li>
</ol>
2.设置有序列表符号类型—type(1,a,A,i,I)
3.有序列表起始数—start（属性值为1,2,3,4,5…….）
三．定义列表：主要用于解释名词
1.<dl>
<dt>名词1</dt><dd>解释1</dd>
<dt>名词2</dt><dd>解释2</dd>
<dt>名词3</dt><dd>解释3</dd>
</dl>
四、菜单列表
<menu>
        <li>第一项</li>
<li>第二项</li>
        <li>第二项</li>
</menu>
5、目录列表
<dir>
<li>第一项</li>
<li>第二项</li>
        <li>第二项</li>
</dir>
四五两种列表的显示和无序列表是相同的，不常用。
五  链接
链接是网页的重要组成部分，如果说文字，图片是网站的躯体，那么链接就是网站的神经细胞，它把整个网站的信息有机的结合到一起。链接能使浏览者从一个页面跳转到另一个页面，实现文档互联，网站互联。  5link\index.html
一． 路径
1. 绝对路径：主页上的文件或目录在硬盘上的真正路径。适用绝对路径的定位链接目标文件比较清晰，但是有2个缺点。1.要输入很多的内容；2.移动文件位置，需要重新设置相关链接。
2. 相对路径：自己相对于目标位置
三种写法：
（1） 同一目录下的文件：直接输入文件名
（2） 上一级目录：在目录名和文件名前加../
（3） 下一级：输入目录名和文件名，用/隔开
二． 建立
1.<a href=”链接地址”>链接文字</a>
2.目标窗口设置：target
    _parent:在上一级窗口打开，框架中适用
    _blank:新建一个窗口打开
    _self:同一个窗口中打开，默认
    _top:浏览器整个窗口中打开，忽略框架
三． 内部链接
1. 普通<a href=”链接地址”>链接文字</a>
2. 书签链接
(1)链接到同一页面：当网页内容特别多时，可以通过书签队内容进行链接，浏览者在阅读时可以通过书签进行内容的跳转。
                定义书签：<a name=”A”>文字内容</a>
                链接：<a href=”#书签名”></a>
(2)链接到不同页面书签：<a href="链接的文件地址#书签的名称">链接的文字</a>
四． 外部链接
  进入www服务站点
mailto: 直接启用邮件系统
六  图像动画
（一）图像
图像让网络变得丰富多彩 
一． 图像格式
1.gif：采用lzw压缩，以压缩相同颜的块来减少图像的大小，由于lzw压缩不会造成任何品质上的损失，而且压缩效率高，在加上gif格式在各种平台上都可以适用，所以很适合在互联网上使用。缺点：只能处理256。
    2.jpg:通常用来保存超过256的图像格式，在压缩过程中删除了一下视觉上不容易被察觉的部分。视觉上能够接受，压缩效率提供，文件也会变小。
    3.png：具备gif的大部分优点，而且图像彩丰富
二． 添加图像  6img\1.html
<img src=”文件地址”>
三． 设置图像的属性  6img\2.html
<img src=”” height=  width=  border=  hspace(水平间距)  vspace(垂直间距)  align=  alt=”提示文字”>
四． 图像超链接
<a href=””><img src=””></a>
五、动态替换图像
<img src="1.GIF" name="aa" onmouseover="aa.src='2.GIF'" onmouseout="aa.src='1.GIF'" />
七  添加多媒体元素
一．设置动态文字    7多媒体.html
<marquee>滚动文字</marquee>
属性：
    文字滚动方向—direction(up,down,left,right)
    循环设置—loop
    滚动速度—scrollamount
    滚动文字背景—bgcolor
    滚动背景面积—width，height
二．设置背景音乐
<bgsound src=””>
格式：mid，avi，mp3
循环次数：loop  属性值为 “infinite”表示浏览者离开该页面前持续播放背景声音。
三、嵌入声音
<embed src=”” width=”” height=”” autostart=”” hidden="">

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。