1、HTML超文本标签语言HTML超文本标签语言姓名：丁宁日期：2009.4.15 QQ：1050335639 858313880 文档说明该文档是本人学习路由器WebUI阶段,对HTML超文本标签语言的总结,只是笔记形式的不是很系统,如有不足或理解偏差之处,还请各位批评指正!标签是HTML的核心,本文主要列举了一些常用的标签,给出了每组标签应用实例的HTML代码供参考.目录1 初识HTML网页设计 12 HTML元素 13 HTML标签 13.1 基本的HTML标签 23.2 HTML链接 23.3 表单标签 33.4 列表标签 53.5 表格标签 64 HTML样式(CSS) 74.1 外部样
2、式表 74.2 内部样式表 74.3 内联样式 75 HTML脚本(JavaScript) 86 HTML综述 81 初识HTML网页设计HTML(Hypertext Markup Language)即超文本标签语言,是WWW的描述语言.HTML语言好似Web文档的规范,它使用各种HTML标签来设置网页显示格式.第一个HTML网页:就像初识VC的第一个HelloC程序一样,我们编一个最简单的网页,以给出像我这样的初学者一个直观的印象.页面的标题这是我的第一个页面。这是粗体文本。 在记事本中敲入上段代码,保存为.html文件,在浏览器中打开该.html文件,则会在浏览页显示:2 HTML元素HT
3、ML文档是由HTML元素构成的文本文件.HTML元素是通过使用HTML标签定义的.上面例子中:这是粗体文本。 就是一个HTML元素，它由起始标签开始3 HTML标签 HTML 标签是用来标记 HTML 元素的。 HTML 标签被 符号包围。 这些包围的符号叫作尖括号。 HTML 标签是成对出现的。例如 和 。 位于起始标签和终止标签之间的文本是元素的内容。 HTML 标签对大小写不敏感， 和 的作用是相同的。3.1 基本的HTML标签标签描述定义 HTML 文档。定义文档的主体。 to 定义标题 1 至标题 6。定义段落。插入折行。定义水平线。定义注释。代码举例：无标题文档 This is h
4、eading 1 usebr to break a line use pto change to another paragraph 网页效果：3.2 HTML链接锚标签，Href 属性，Target属性,name属性HTML 使用 （锚）标签来创建连接另一个文档的链接。锚可以指向网络上的任何资源：一张 HTML 页面，一幅图像，一个声音或视频文件等等。Href属性用来定位需要链接的文档.使用 Target 属性，你可以定义被链接的文档在何处显示。Name 属性用于创建被命名的锚（named anchors）。当使用命名锚（named anchors）时，我们可以创建直接跳至页面中某个节的链接
5、，这样使用者就无需不停的滚动页面来寻找他们需要的信息。代码举例：链接到按钮a href=http:/This chapter explains ba bla blaFirst name: Chapter 2This chapter explains ba bla blaChapter 3This chapter explains ba bla blaChapter 4This chapter explains ba bla bla网页效果:3.3 表单标签标签描述定义供用户输入的表单定义输入域定义文本域 (一个多行的输入控件)定义一个控制的标签定义域定义域的标题定义一个选择列表定义选项组定义下
6、拉列表中的选项定义一个按钮定义表单的形式: 输入类型是由类型属性(type)定义的.经常被用到的输入类型如下:文本域,单选框,复选框,下来表单,按钮表单,绘制带标题的框:First name: Female： Male: I have a bike! SaabFiat健康信息：身高：体重：注:单选框中的几个选择项根据name确定为一组,一组选择中只能有一项被选择,如果不指定为同样的name,则无法实现确定为一组.网页效果:表单的动作属性(Action)和确认按钮:用户单击确认按钮时,表单的内容会被传送到另一个文件.表单的动作属性定义了目的文件的文件名.由动作属性定义的这个文件通常会对接收到的输
7、入数据进行相关的处理.代码举例:Username: 网页效果:3.4 列表标签标签描述定义有序列表。定义无序列表。定义列表项。定义定义列表。定义定义项目。定义定义的描述。代码举例: 苹果 苹果 香蕉 香蕉 定义列表 定义项目 定义的描述 注:无序列表使用标签,该标签可以使用type注明列表的符号, type=”disc”,”circle”,”square”分别为圆点,圆圈,方点.网页效果:3.5 表格标签表格描述定义表格定义表格标题。定义表格的表头。定义表格的行。定义表格单元。定义表格的页眉。定义表格的主体。定义表格的页脚。定义用于表格列的属性。定义表格列的组。代码举例: 这是一个段落。 这是
8、另一个段落。 这个单元包含一个表格： A B C D 这个单元包含一个列表： 苹果 香蕉 菠萝 HELLO网页效果:4 HTML样式(CSS)当浏览器读到一个样式表,它就会按照这个样式表来对文档进行格式化.有一下三种方式来插入样式表:4.1 外部样式表当样式需要被应用到很多页面的时候,外部样式表将是理想的选择.使用外部样式表,可以通过更改一个文件来改变整个站点的外观.4.2 内部样式表当单个文件需要特别样式时,就可以使用内部样式表.可以在head头部分通过标签定义内部样式表.body background-color: redp margin-left: 20px4.3 内联样式当特殊的样式需
9、要应用到个别元素时,就可以使用内联样式.使用内联样式的方法是在相关的标签中使用样式属性.样式属性可以包含任何CSS属性.This is a paragraph5 HTML脚本(JavaScript)向HTML添加脚本(Script),使其动态性和交互性更强.HTML中的脚本使用标签进行定义.可以使用type属性来指定脚本语言.document.write(Hello World!)上面的脚本输出以下结果:6 HTML综述本文本在初步了解HTML语言的基础上着重介绍了HTML的几种标签:基本标签,链接标签,表单标签,列表标签和表格标签.这几种是在网页中应用比较广泛标签,其他一些标签可以边用边查,边用边记.介绍了如何在HTML中引用CSS样式,以便于外观的批量修改.最后介绍了在HTML中添加脚本的方法,用以增强网页的交互性和动态性.
