HTML是web元素中最基础，也是最重要的一部分。它是一种解析语言，而不是编程语言，因为它没有变量，控制循环等特性，通过编写脚本形成特定的html文件。
    html文件是由特定的标签组成，由<html>开始到</html>结束，里面包含head区和body区。head区是放网页初始化的元素，比如说CSS，JavaScript代码，都可以在这里进行初始化。body区用来显示网页中元素的区域，希望在网页里显示的元素都要写在这里面才最终有效。
    当打开一个html文档的时候，浏览器首先下载，并按照这个顺序进行解析。当它遇到特定的标签的时候就将这个效果显示浏览器。我们的课程就是如何编写html文件，如何通过html文件去制作网页。
    大家可能要问，为什么有这么好的开发工具，还要我们来编写html代码呢？首先那样做会产生很多冗余代码，增加了文件的体积，而导致下载时间变长，解析变慢；其次用网页制作工具的话产生小错误的时候很难排除，如果能读懂这些代码的话会比较容易到出错原因。
    标题文字是由标签<hn>构成，+属性>标题文字</hn>结束，n是1-6之间的数字，放到body区中。可以看到标题文字是加粗显示的，属性在后面即、具体再讲。
    <p>段落标记，<br>换行标记 空格标记。在源文件中排版的格式和在浏览器中不一样，说明是经过解析得到的。P标签也可以把</p>去掉，执行效果是一样的。浏览器遇到<br>标签进行换行操作。 就是达到加入一个空格的操作。
    标签及其属性的通用书写格式为<标签名 属性1=“属性值” 属性2=“属性值”…属性N=“属性值”>内容</标签名>。中间的空格为半角空格。属性值可以是阿拉伯数字，也可以英文单词。下面通过一个区域控制标签div（<div align=””>文本</div>来认识一下标签和属性怎么结合在一起使用，div标签也可以理解成一个大的段落标签。
    align属性是用于控制网页中元素的对齐方式，有三个值：center/left/right。在div里没有加p标签或br标签是自动换行显示的。属性的具体值在html中是不区分大小写的，属性值的引号也可以省略，但是去掉后在编辑器中加亮显示功能就没有了，这样为我们修改起来就会带来麻烦。
    加入水平线的方法是<hr align=”” size=”” width=”” color=”” [noshade]>在html标签中有些属性是通用的，比如说align属性，而noshade就是水平线的特殊属性指示水平线是否显示阴影。width和size都是指的像素值，也可以写成十六进制形式，英文字符，所以属性值是很丰
富的。
    在html语言当中为我们提供了pre标签用来显示与源文件中完全相同的文本内容，所以如果我们写一首诗或者是散文就可以用pre标签在源文件中显示特定的格式。简化了制作过程，否则我们要用br或p结合 来控制格式相对要麻烦很多。
    文字标签“font”格式为<font size=”” color=”” face=””>文字</font>。用于在html文件中设置文字属性。Size是字号，face是字体。它可以与其他属性联合使用。字体可以直接输入字体的名称，如隶书。联合使用如套用标签到font里面位于文字两边，如<b>文字</b>加粗，<u>文字</u>下划线，<i>文字</i>斜体显示。
为文字加上上标的方法是<sub>上标内容</sub>;加上下标的方法是<sup>下标内容</sup>。相同标签套用的时候应该怎样去看优先级的问题，现在予以讨论。Font的套用有一个优先级的问题，离要设置文字近的标签起作用，相对远的设置被屏蔽掉了，优先级低。
超级链接标签是指当我们点击超链接具体元素会将一个特定的网页打开，或者本吧、网页跳转到新网页，它具体的机构是<a href=”绝对地址”  name=”热点名”  target=”打开方式”> 链接元素</a>。打开方式有_blank,_parent,_child或_self，默认情况在本窗口打开。
name属性指示热点，热点由两个部分构成，一个是热点文本即点击那部分，一个是显示的热点文本，构成如<a href=”路径#标记号”>热点文本</a>  <a name=”标记号”>显示的热点文本</a>，两个标记号一致，对应的。在网页中经常可以看到由好多热点标签组成，比如说网页中有好多个标题对应着一部分文章，加入热点使读者方便到各个章节。
建立列表的方法有两种，一种是有序列表ol，一种是无序列表ul，它们的结构大致相同，<ul type=””> … <li></li> … </ul> ;<ol type=””> … <li></li> … </ol>。对于无序列表大概有这么几种—实心圆disc、空心圆circle、方框squre，有序列表有数字，英文，都有大小写规格，还有罗马字母I/i等。
加入图片的格式为<img src=”图片路径”  alt=”简单说明”  width=”宽度”  height=”高度”  border=”边框宽度”  hspace=”水平方向空白”  vspace=”垂直方向空白”  align=”对齐方式”>。alt是指当鼠标悬停在图片上显示的说明文字。vspace和hspace是结合align使用的，这个align属性和前面的讲的对齐方式有点不同。经常用在图片周围文字的排版，非常重要。vspace和hspace和图片整体作为所占的区域大小，排列时以整体大小为对齐参考。
认识一下表格的结构，<table height=””  width=””  cellspacing=””  cellpadding=””  border=”” 
align=””> <tr> <td> </td> </tr> </table>。cellspacing指表格内边框和外边框的间距，cellpadding是指表格填充元素和边框的间距，border是表格的边框，tr是指一行，td是指一列。当然中间可以有多对tr和td标签。所有表格内容都写在td中，tr只是指示有这么个行存在。
表格有内边框和外边框之分，认识到这一点非常重要，同时一般一个tr标签一般包含多个td标签。td里面必须要有要显示的东西，再咋样也要有 进行站位处理。对单元格的设置要在最近的td属性里面来做。
细线表格的制作方法是在html代码中加入。往往由于Dreamweaver自动为我们加入 进行站位导致制作小于12像素的表格遇到困难。细线表格是表格的高度为1px。所以会编写html代码是解决这种问题很好的方法。可以设置表格中元素的水平及垂直位置达到更好的排版效果。align水平对齐，valign是垂直对齐。给图片加链接与给文字加链接是一样的，只不过它是一个图片标签代替原来放文字的地方。
设置表格的高度和宽度可以按照像素值或占网页的百分比来设定。最外层的表格一般设定为固定的像素值，这样做的好处是不会影响表格里元素的排版效果；而设定为百分比的话会缩
放以适应网页大小。还要注意的是表格的宽度应该是所有列的宽度中和，高度类似，不然对排版会产生严重的错误。当然得计算一下总和，也可以将最后一列宽度高度都不设置，Dreamweaver会自动计算以满足总宽度或高度值。
colslpan是跨多列标记，rowspan是跨多行标记。做表格的时候经常要拆分表格，所以跨行与跨列是非常重要的。它们都是写在td标签中，而不是其他标签中。制作不对称的列拆分方法是嵌套表格来实现。
跨列操作要比跨行操作简单一些，下面讲解跨行操作。进行跨行操作后原来的列和新拆分的第一行组成一行，在一个tr标签里面。表格嵌套不要超过三层，不要出现拆分比较复杂的表格操作。
表单中的复选框属于input标签，格式为<form name=”” action=”” method=”” >
<input type=”checkbox” name=”” value=””> </form>注意一定要有表单域，否则是一个无效的表达。多行文本框在表单中也是比较重要的控件，与其他不同的地方是它有行宽和列宽属性。有一个提交按钮是<input type=”submit” value=”提交”> method有get和post的区分，get
是发送少量数据，post是发送大量数据包括加密数据。以get形式发送可在地址栏中看到name值=+字符串的形式，这样的话一些重要的数据如用户密码容易暴露出来，所以要用post形式发送。应用表单的时候要注意这一点，其他表单应用类似。
    html文件中meta的属性有两种：name和http-equiv。name属性主要用于描述网页，以便于搜索引擎机器人查、分类。这其中最重要的是description（站点在搜索引擎中的描述）和keywords（分类关键词）。http-equiv主要是对网页本身的一些设置。
eg.
<meta  http-equiv="Content-Type" content="text/html; charset=gb2312" />
<meta name="keywords" content="易生活" />
<meta name="description" content="易生活,西电，网上订餐" />
<meta name="robots" content="all/none/index/noindex/follow/nofollow" />
<!--
设定为all：文件将被检索，且页面上的链接将被查询；
设定为none：文件将不被检索，且页面上的链接将不被查询；
设定为index：文件将被检索；
设定为noindex：文件将不被检索，但页面上的链接可以被查询；
设定为follow：页面上的链接可以被查询；
设定为nofollow：页面上的链接不可以被查询
-->
    http-equiv对网页进行设置，具体有n代表多少秒，设置过期时间也比较重要，比如我们提交表单，也可以用编程语言生成。IE为了提高访问速度有时是从缓存里读取，这样就可能导致读取的是旧页面。
<meta http-equiv=content=”content-type” content=”text.html ;charset=”gb2312”> <!—设置页面语言
<meta http-equiv=”refresh” content=”n;url=yourlink”> <!—设置刷新网页
简单网页制作源代码<meta http-equiv=”expires” content=”Mon,12 May 2008 00:21:20 GMT”> <!设置页面过期时
<meta http-equiv=”parama” content=”no-cathe”> <!—设置页面不从缓存中读取-->

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