html_安科网

HTML：TR TD TH OL UL LI

什么是HTML

　　超文本标记语言(HyperText Markup Language)，标准通用标记语言下的一个应用；是网页制作必备的编程语

　　言

　　“超文本”就是指页面内可以包含图片、链接，甚至音乐、程序等非文字元素。

　　HTML 不是一种编程语言，而是一种标记语言。

HTML基本结构

　　<!DOCTYPE html> 声明为 HTML 文档，HTML文档也常称为网页，

　　一个文档包含HTML标签和文本

　　<html> 与 </html> 之间的文本描述网页，同时HTML元素也是当前页面的根元素

　　<head>是包含了文档的元(meta)数据，如定义网页编码格式<meta charset="utf-8">

　　<title>元素描述当前文档页面的标题

　　<body> 与 </body> 之间的文本是可见的页面内容

　　<h1> 与 </h1> 之间的文本被显示为标题

　　<p> 与 </p> 之间的文本被显示为段落

HTML注释

这是一个H5标题。

HTML标签

　　HTML 标记标签通常被称为 HTML 标签 (HTML tag)。

　　HTML 标签是由尖括号包围的关键词，比如 <html>

　　HTML 标签通常是成对出现的，比如 <\b> 和 </b>

　　标签对中的第一个标签是开始标签，第二个标签是结束标签

　　多数情况下，HTML文档中的标签可以互相嵌套，实现更复杂的功能

<!DOCTYPE html>

　　<html>

　　<head>

　　</head>

　　<body>

　　　　<h1>我的第一个标题。</h1>

　　　　<p>我的第一个段落。</p>

　　</body>

　　</html>基本标签

标题标签：h1~h6

段落标签：p

块级标签：div

换行标签：br

图片标签：img

链接标签：a

无序列表：ul、li

<h1>

　　这是一个最大的标题

</h1>

<p>

　　每一个段落标签中的内容都会换行输出

</p>

<h1>

　　div标签常用来组合一整块标签内容

</h1>

<p>

　　以便通过CSS样式来对其中这些元素进行格式化控制

　　比如当前div标签下的所有文本均为红色

</p>

</div>

　　111

<br>

　　222

src:用来指明当前图片路径

alt：

　　1.光标位于图片时所显示的内容

　　2.当图片加载失败时所显示的内容

　　href: 控制访问地址

　　a:标签的文本元素为页面展示内容有序列表：ol、li

　　连接外部文件

像img等类似的标签需要我们去访问一个外部文件，常用的方式有如下几种

引入外部图片：

引入另外一个网页：　　

引入CSS样式文件：

　　rel: relationship的英文缩写,用于定义链接的文件和HTML文档之间的关系

　　stylesheet: 样式表

　　type: 外链文档的类型

　　href: 外链文档的路径

引入js文件：

src与href：

　　src用于引入资源，引入的资源为页面必不可少的一部分，类似换内裤

<ul>

　　<li>无序列表项1</li>

　　<li>无序列表项2</li>

　　<li>无序列表项3</li>

</ul>

ul:指明当前为无序列表

li:具体列表项使用这个标签

单个列表项可不加ul标签

<ol>

</ol>

ol:指明当前为有序列表

li:具体列表项使用这个标签

单个列表项可不加ul标签

　　rel: relationship的英文缩写,用于定义链接的文件和HTML文档之间的关系

　　stylesheet: 样式表

　　type: 外链文档的类型

　　href: 外链文档的路径

　　<script type="text/javascript" src="js/jquery.js"></script>href只是引用资源，表示超文本引用，类似穿外套

相对路径：使用当前文件为起点定位资源

./：表示位于当前文件所在目录下

../：表示位于当前文件所处的上一层目录下

绝对路径：使用当前磁盘目录为起点定位资源

表格标签 table

表格标签由 table 标签进行定义

表格中的每一行由tr标签定义 table row

每一行有几个单元格由td标签定义 table data

表格的表头由th标签定义 table header

　　<tr>

　　</tr>

　　<tr>

　　</tr>

　　<tr>

　　　</tr>

</table>

border(属性): 定义表格边框，数字越大，边框越粗

caption(标签): 定义表格标题

　　<tr>

　　</tr>

　　<tr>

　　</tr>

　　<tr>

　　　　<td colspan="3" align="center">合并单元格</td>

　　</tr>

</table>表单标签 form

表单用于收集不同类型的用户输入，表单由不同类型的标签组成

单行文本输入框

单选框

复选框

上传文件

多行文本输入框

下拉表单元素：select

cellpadding: 规定单元格边缘和内容的空白

cellspacing: 增加单元格之间的距离

align: 设置单元格内容靠齐、left|right|center

frame: 控制围绕表格的边框

box 四面环山

above 上面

below 下面

hsides 上下两侧

vsides 左右两侧

colspan：合并列

rowspan：合并行

<label>密码：</label><input type="password" name="password" placeholder="请输入密码"

text:单行文本框

password:密码输入框

value:定义表单元素的值

name:定义表单元素的名称，提交到后台时通过该值获取对应表单中的数据

<input type="radio" name="gender" value="0" /> 男

<input type="radio" name="gender" value="1" /> 女

在单选框中的name属性可以控制那几个表单为一组

<input type="checkbox" name="like" value="sing" /> 唱歌

<input type="checkbox" name="like" value="run" /> 跑步

<input type="checkbox" name="like" value="swiming" /> 游泳

</select>

option: 下拉框中的具体属性

value: 在表单提交时真正发送给服务器的值

按钮：

提交按钮：submit

点击时触发form标签中的action动作

重置按钮：reset

重置所属表单中所有表单框的所填数据

普通按钮：button

html

相关推荐