HTML是英文Hyper Text Mark-up Language(超文本标记语言)的缩写,他是一种制作万维网页面标准语言(标记),相当于定义统一的一套规则,大家都来遵守他,这样就可以让浏览器根据标记语言的规则去解释它,浏览器负责将标签翻译成用户"看得懂"的格式,呈现给用户,网页文件也经常被称为HTM文件,HTML是万维网的核心语言、标准通用标记语言下的一个应用超文本标记语言(HTML)的第五次重大修改,2014年10月29日万维网联盟宣布,经过接近8年的艰苦努力,该标准规范终于制定完成.
超文本标记语言(HyperText Markup Language 简称：HTML)是一种用于创建网页的标准标记语言.HTML是一种基础技术,常与CSS、JavaScript一起被众多网站用于设计令人赏心悦目的网页、网页应用程序以及移动应用程序的用户界面,网页浏览器可以读取HTML文件,并将其渲染成可视化网页.HTML描述了一个网站的结构语义随着线索的呈现,使之成为一种标记语言而非编程语言.
HTML可以嵌入如JavaScript的脚本语言,它们会影响HTML网页的行为,网页浏览器也可以引用层叠样式表(CSS)来定义文本和其它元素的外观与布局,维护HTML和CSS标准的组织万维网联盟(W3C)鼓励人们使用CSS替代一些用于表现的HTML元素.
HTML 页面结构
标准的HTML文档由标签和要显示在网页上的内容组成,HTML用于描述功能的符号称为"标签",比如一个HTML文档中必须包括以下几个标签<head>,<html>,<body>等因为这些是构成网页的最基本的元素,HTML标签规定了HTML文档的逻辑结构,并且控制文档的显示格式,然后由浏览器来负责解释并显示页面,通过使用标签可以区分文本文件的各个组成部分,还可以对网页上的文字、表格、图片等多媒体数据所出现的位置、形式、顺序及网页间的超级链接关系进行设定.
通常情况下,一个最基本的网页格式如下面的例子所示的样子,具体的代码和解释如下:
#文档说明,告诉浏览器当前的文档类型 #指定文件的格式等 #HTML头部信息 #指定文件编码方式Title #指定文件标题 #body区域是HTML文档的主体部分
◆Head 标签◆
head标签用于定义文档的头部,它是所有头部元素的容器.<head>中的元素可以引用脚本、指示浏览器在哪里找到样式表、提供元信息等等,文档的头部描述了文档的各种属性和信息,包括文档的标题、在 Web 中的位置以及和其他文档的关系等.绝大多数文档头部包含的数据都不会真正作为内容显示给读者,<title>定义文档的标题,它是 head 部分中唯一必需的元素.
下面这些标签通常用在head部分：<base>,<link>,<meta>,<script>,<style>,以及<title>.
#网页的关键字 #网页的描述信息 #每2秒中刷新以下网页 #2秒后重定向到某网站my web #网页的窗口标题 #指定网页图标 #引用外部css文件 #引用外部js文件
◆Body 标签◆
body 标签是成对出现的,在<body>...</body>标签对之间的内容,将显示在Web浏览器窗口的用户区域,它是HTML文档中最主要的部分,我们可以把HTML文档的主体区域简单地理解成标题以外的所有部分,该部分可以包含<table>,<font>,<img>,<div>等标签,结束标签</body>用来指明主体区域的结尾.
在body标签中可以规定整个文档的一些基本属性,例如以下几个属性.
| 属性名称 | 属性说明 |
|---|---|
| bgcolor | 指定HTML文档背景色 |
| text | 指定HTML文档中文字颜色 |
| link | 指定HTML文档中,待链接超链接对象的颜色 |
| alink | 指定HTML文档中,链接超链接对象的颜色 |
| vlink | 指定HTML文档中,已链接超链接对象的颜色 |
| background | 指定HTML文档中,文档的背景文件 |
◆特殊字符◆
在HTML中有很多特殊的符号是需要特别处理的,例如<,>这两个符号是用来表示标签的开始和结束的,没有办法通过直接按键来输入,必须用输入编码表示法<来输入.
通常情况下HTML文件,会自动截去多余的空格,不管加多少空格,都被看作一个空格,如果要显示空格中的多个空格,可以使用 表示空格,常用的特殊字符及显示结果如以下表格中整理的内容.
| 源代码 | HTML显示结果 |
|---|---|
| & nbsp; | 插入一个非间断空格 |
| & ensp; | 插入两个普通空格的宽度 |
| & emsp; | 插入四个普通空格的宽度 |
| < | 插入一个小于号< |
| > | 插入一个大于号> |
| & | 插入一个and符号 |
| " | 插入一个双引号 |
以上的一些简介,就已经说面完了所有关于HTML结构的问题了,HTML不算是一门编程语言,我们只需要学习一些常用的标签就可以了,下面将具体介绍一些常用的标签的属性与使用方法.
HTML 通用标签
格式标签: 格式化标签常用的如下所示,其中Div标签是在布局中使用最频繁的,其他的用的少.
标题标记,共有6个级别,范围1~6 块级标签,分区显示标记,也称之为层标记 换段落标记,由于多个空格和回车在HTML中会被等效为一个空格 内联标签,字符占多少标签就占多少 强制换行标记,让后面的文字、图片、表格等,显示在下一行
水平分割线标记,段落之间的分割线居中对齐标记,让段落或者是文字相对于父标记居中显示 预格式化标记,保留预先编排好的格式
文本标签 常用的文本标签也就以下这些,但是我们基本不会使用,字体调整一般会使用CSS来操作.
粗字体标记 斜字体标记 文字下标字体标记 文字上标字体标记: 打印机字体标记 引用方式的字体,通常是斜体 表示强调,通常显示为斜体字 表示强调,通常显示为粗体字 小型字体标记 大型字体标记 下划线字体标记:字体设置标记,设置字体的格式,三个常用属性 (1)size（字体大小）: (2)color（颜色）: (3)face（字体）:
列表标签 列表标签中最常用的也就是li,ul这两种形式,分别是有序和无序标签组.
- : 无序列表标记,此标签声明的列表没有序号
- : 定义型列表,对列表条目进行简短的说明< -----------------------[ol定义格式]----------------------- >
- 软件说明：
- 简单介绍软件的功能及基本应用
- 软件界面
- 用于选择软件的外观
- : 有序列表标记,可以显示特定的一些顺序
HTML 拓展标签
A超链接标签: 该标签定义超链接,用于从当前页面链接到其他页面,或从页面的某个位置跳转到当前页面的指定位置.
链接文字百度< -----------------------[参数解释]----------------------- >href:链接的地址,链接的地址可以是一个网页,也可以是一个视频、图片、音乐等target: (1) _blank在一个新的窗口中打开链接 (2) _seif(默认值)在当前窗口中打开链接 (3) _parent在父窗口中打开页面（框架中使用较多） (4) _top在顶层窗口中打开文件（框架中使用较多）
超链接瞄点: 使用超链接瞄点,如下例子寻找页面中id=i1的标签,将其标签显示在页面顶部.
第一章 第二章第一章内容第二章内容
Img图片标签: 该标签用于指定嵌套一些图片图像,将图像展现出来.
< -----------------------[参数解释]----------------------- >src属性：指定我们要加载的图片的路径和图片的名称以及图片格式width属性：指定图片的宽度,单位px、em、cm、mmheight属性：指定图片的高度,单位px、em、cm、mmborder属性：指定图标的边框宽度,单位px、em、cm、mmalt属性：(1)作用一：当网页上的图片被加载完成后,鼠标移动到上面去,会显示这个图片指定的属性文字 (2)作用二：如果图像没有下载或者加载失败,会用文字来代替图像显示 (3)作用三: 搜索引擎可以通过这个属性的文字来抓取图片
音频与视频: 下面的两对,embed是音频文件,video是视频文件,其他参数自行百度.
HTML 表单标签
HTML 使用表单向服务器提交请求,表单、表单控件的主要作用就是收集用户输入,当用户提交表单时,用户输入内容将被作为请求参数提交到远程服务器.因此在Web编程中,表单主要用于收集用户输入的数据,在需要与用户交互的Web页面中,表单、表单控件都是极为常用的,下面将收集几种常用的表单控件.
Label标签: label标签不会向用户呈现任何特殊效果,只起到显示的作用,标签需要和控件ID关联.
Form 表单: 用于生成输入表单,该元素是用来提交数据必选结构,也是HTML中最基础的元素.
Input 控件: 该表单是网页控件表单,其中包括了常用的网页控件,也是最重要的表单之一.
< -----------------------[type类型]----------------------- >type = "text" 文本输入框 type = "color" 颜色选择器type = "password" 密码输入框 type = "date" 日期选择器type = "email" 邮件输入框 type = "time" 时间选择器type = "radio" 单选框 type = "week" 周选择器type = "checkbox" 复选框 type = "month" 月选择器 type = "submit" 提交按钮 type = "number" 数字选择器 type = "button" 普通按钮 type = "search" 本地搜索框 type = "reset" 重置按钮 type = "range" 网页拖动条 type = "hidden" 隐藏域 type = "file" 文件域 type = "image" 图像域 type = "progress" 滚动条 < -----------------------[参数解释]----------------------- >value 默认输入的值name 定义input名称size 定义输入框框的长度src 指定图像域所显示图像的URLchecked 设置指定单选框复选框为选中状态,该属性只能是checkeddisabled 设置首次加载时禁用当前元素,该属性只能是disabledmaxlength 限制输入框最大允许输入的字符长度,maxlength=10readonly 指定该文本框内的值不允许用户的修改,readonly=trueplaceholder 指定输入框的默认提示信息,placeholder="hello lyshark"
Select 表单: 该表单用于创建列表框或者是下拉菜单,该元素必须和option元素结合使用.
< -----------------------[参数解释]----------------------- >select 属性 size 指定该列表框内可同时显示多少个列表项 name 定义这个列表的名称,就是列表的名字 multiple 该属性不用赋值其作用是,是否使用多选或者下拉框option 属性 value 给选项赋值,指定传送到服务器上面的值 selected 指定默认的选项optgroup 属性 label 分组的名字
Textarea 标签: 可以实现接收用户输入,用户可以在文本域中输入任意字符,并且长度没有限制.
< -----------------------[参数解释]----------------------- >name 指定标签的名字value 指定标签的默认值cols 指定文本域的宽度rows 指定文本域的高度disabled 指定禁用文本域readonly 指定文本域只读
List 列表: 列表方法,可以将一个普通文本框,通过使用datalist标签将其变成一个列表.
Table 表格: 表格的定义由table标签来定义,每个表格均有若干行,每行被分割为若干单元格由td标签定义.
| 姓名 | 字段1性别 | 字段2年龄 | 字段3
|---|---|---|
| 陈荣华 | 定义表格单元男 | 22岁 |
Fieldset标签: 该标签主要用来装饰form表单,<legend>标签为fieldset元素定义标题.
Iframe标签: 创建包含另外一个文档的内联框架(即行内框架),说白了就是网页中嵌入网页.