标签分为单标签(空标签)与双标签(标准标签),双标签有一对:<起始标签></闭合标签>,单标签只有一个<标签名 />
单标签: <img /> <a /> <br /> <hr /> 双标签:<p> <h> <strong> <b> <i> <em> <ul> <li> <ol> <dl>
从标签的占行也可以分为块级标签与行内标签,块级标签单独占一行,行内标签在一行中可以同时存在多个
块级标签特点:
默认占据一整行块级标签设置宽高是有效的可以容纳其他的行内元素行内标签特点:
在一行上逐个展示行内元素设置宽高无效行内元素不能嵌套块级元素行内块级标签特点:
在一行上逐个展示设置宽高有效
常用的标签种类:
<br /> 换行标签
<br>标签属于块级标签,一个<br>单独占一行<h1></h1> 标题标签(h1~h6)
被标题标签包裹起来的内容会加粗加大,h1最大,h6最小,没有h7及其他h标签一般一个网页只存在一个<h1>标签<h>标签属于块级元素,一个<h>标签单独占一行<p></p> 段落标签
段落标签属于块级标签,被<p></p>标签包裹起来的内容另起一行,并且<p>标签后面的内容无论是块级还是行内标签,都另起一行<b> <strong> 文字加粗
<b> <strong>属于标准标签,是行内标签<i> <em> 文字倾斜
<i> <em>属于标准标签,是行内标签<hr /> 水平线标签
<hr />标签属于块级标签,一个<hr />就是一条分割线<a><a/> 超链接标签
<a
href="http://www.baidu.com" target="_blank">百度一下,你就忘了</a>,<a>标签有个默认属性href,href的值可以是一个网址,也可以是一个锚点,点击<a>标签包裹的内容时会跳转到对应网址或锚点target属性有两个值"_self"与"_blank",target属性可写可不写,不写时默认为"_self"
_self: 在本网页跳转到目标网页_blank: 在新生成的标签页中跳转到目标网页,原网页不变<a>标签也可以作为一个锚点使用,具体使用方法为:
<a name="mao">锚点</a> 先设置一个锚点,a标签内属性只有一个name.然后在这个网页的其他地方写入一个正常的<a>标签,标签内的href属性的值写"#mao"当鼠标点击后面这个a标签包裹的内容时,会自动跳转到上面设置的锚点的地方.<img /> 图片标签
<img
src="img/11.jpg"
width="200"
height="100"
title="小骆驼"
alt="骆驼" /><img />标签有src width height title alt五个属性
src: 必选属性,指定该图片的路径alt: 当该图片显示失败时对该图片的描述width: 可选属性,设置图片的宽度,单位为px,当只设置了width属性时,图片的高度会根据原图片的比例自动缩放,从而使图片不变形height: 可选属性,设置图片的高度,单位为px,当只设置了height属性时,图片的宽度会根据原图片的比例自动缩放,从而使图片不变形title: 可选属性,鼠标移动到图片上显示的文字提示<img />标签为空标签<img />标签是行内标签<ul><li> 无序列表标签
<ul><li>无序列表一般一起嵌套出现<ul type="disc"> ul标签有个type属性,用来设置该无序列表内的每一项列表前面的符号类型。
disc: 符号显示为实体圆心(默认值)circle: 符号显示为空心圆square: 符号显示为实体方心none: 什么符号也没有
<ol><li>有序列表
<ol><li>有序列表一般一起嵌套出现<ol type="1"> ol标签有个type属性,用来设置该有序列表内的每一项列表前面的序号符号
1: 使用数字作为列表序号(默认值)A/a: 使用大写/小写字母作为列表序号I/i: 使用大写/小写罗马数字作为列表序号<ol type="1" start="4"> ol标签中还有一个start属性,strat="4"表示列表里的第一项从4开始
<dl><dt><dd>定义列表
<span></span> span标签,行内标签
本身没有任何效果,通常用来方便提取文本文字的某些内容,方便操作某些文字你在<span style="color: red;">春天</span>回来,我从<span style="color: red;">春天</span>离开。
被span标签包裹起来的文字可以单独设置颜色等信息<div></div> div标签,块级标签
本身没有任何效果,通常使用div标签来划分页面,方便后期处理div标签中可以包含本身或任何其他标签