导语:
HTML(Hyper Text Markup Language 超文本标识语言)是一种用来制作超文本文档的简单标记语言。它通过标记符来告诉浏览器如何显示其中的内容(如,文字如何处理,画面如何安排,图片如何显示等)。浏览器按顺序阅读网页文件,解释其执行过程。但对于不同的浏览器,显示效果也可能会不同。
一. HTML基础
1.HTML头部
在
元素中你可以插入脚本(scripts), 样式文件(CSS),及各种meta信息。可以添加在头部区域的元素标签为:
,标签
为搜索引擎定义关键词:
为网页定义描述内容:
定义网页作者:
每30秒中刷新当前页面:
2.HTML链接
HTML使用标签来设置超文本链接。超链接可以是一个字,一个词,或者一组词,也可以是一幅图像,您可以点击这些内容来跳转到新的文档或者当前文档中的某个部分。在标签 中使用了href属性来描述链接的地址。
语法格式为:链接文本
例如 访问菜鸟教程
target属性:定义被链接的文档在何处显示,例如下面这行会在新窗口打开文档:
3.HTML图像
图像标签与源属性(src)
在 HTML 中,图像由 标签定义。
源属性的值是图像的 URL 地址。
alt属性
alt 属性用来为图像定义一串预备的可替换的文本。
例如,![](boat.gif)
在浏览器无法载入图像时,替换文本属性告诉读者她们失去的信息。此时,浏览器将显示这个替代性的文本而不是图像。为页面上的图像都加上替换文本属性是个好习惯,这样有助于更好的显示信息,并且对于那些使用纯文本浏览器的人来说是非常有用的。
添加背景图片
3.HTML表格
HTML 表格和边框属性
使用边框属性来显示一个带有边框的表格:
Header 1 | Header 2 |
---|---|
row 1, cell 1 | row 1, cell 2 |
row 2, cell 1 | row 2, cell 2 |
在浏览器显示如下:
4.HTML列表
无序列表
无序列表是一个项目的列表,此列项目使用粗体圆点(典型的小黑圆圈)进行标记。
无序列表使用
- 标签
- apple
- banana
在浏览器显示如下:
有序列表
有序列表也是一列项目,列表项目使用数字进行标记。
有序列表始于
- 标签,每个列表项始于
- 标签, 列表项项使用数字来标记。
- apple
- banana
浏览器中显示如下:
自定义列表
自定义列表不仅仅是一列项目,而是项目及其注释的组合。
自定义列表以
-
开始。每个自定义列表项的定义以
-
开始。
-
Coffee
- - black hot drink Milk
- - white cold drink
浏览器显示如下:
HTML区块
内联元素(inline element)
内联元素在显示时通常不会以新行开始
例如,
, ,块状元素(block level element)
块级元素在浏览器显示时,通常会以新行来开始(和结束)。
例如
,
,
,元素元素是块级元素,它是可用于组合其他 HTML 元素的容器。元素没有特定的含义。除此之外,由于它属于块级元素,浏览器会在其前后显示折行。如果与 CSS 一同使用,
元素可用于对大的内容块设置样式属性。元素的另一个常见的用途是文档布局。它取代了使用表格定义布局的老式方法。使用 元素进行文档布局不是表格的正确用法。 元素的作用是显示表格化的数据。元素
元素是内联元素,可用作文本的容器。
元素也没有特定的含义。
当与 CSS 一同使用时, 元素可用于为部分文本设置样式属性。
HTML表单
文本域(Text Fields)
文本域通过 标签来设定,当用户要在表单中键入字母、数字等内容时,就会用到文本域。
First name:
Last name:浏览器显示如下:
表单本身并不可见。同时,在大多数浏览器中,文本域的缺省宽度是20个字符。
密码字段(Password)
密码字段通过标签 来定义
First name:
Last name:
Password:浏览器显示如下:
单选框(Radio Buttons)
标签定义了表单单选框选项
First name:
Last name:
Password: MaleFemale浏览器显示如下:
复选框(Checkboxes)
定义了复选框. 用户需要从若干给定的选择中选取一个或若干选项。
First name:
Last name:
Password: Male FemaleI have a bikeI have a car提交按钮(Submit Button)
定义了提交按钮.
当用户单击确认按钮时,表单的内容会被传送到另一个文件。表单的动作属性定义了目的文件的文件名。由动作属性定义的这个文件通常会对接收到的输入数据进行相关的处理。
First name:
Last name:
Password: Male FemaleI have a bikeI have a car假如您在上面的文本框内键入几个字母,然后点击确认按钮,那么输入数据会传送到 "html_form_action.php" 的页面。该页面将显示出输入的结果。
以上是本人在使用HTML时常用的知识点,如有什么不妥或者不到位之处,还请多多指教。