HTML知识点 | 青训营笔记web的特点： url：协议类型：//服务器地址（端口号）/路径/文件名服务器协议类型

web的特点：

易导航和图形化的界面；与平台无关系；分布式结构；动态性；交互性；

url：

统一资源定位符，由协议，主机域名（或IP地址），路径和文件名构成协议类型：//服务器地址（端口号）/路径/文件名

服务器协议类型：

http：超文本传输协议 https：用加密传送的超文本传输协议 ftp：文件传输协议 mailto：电子邮件地址

head的元信息meta标记：

name属性代表名称/值对，定义作者，关键词，网页简短描述等，name值为robot时，content可以为all（文件链接都可以被搜索引擎机器人检索）、none（文件链接都不可以）等 http-equiv属性用于提供http协议的响应头报文

body标签：

text（文本颜色），bgcolor（背景颜色），alink（活动链接颜色），link（未访问链接的默认颜色），vlink（已访问链接的颜色） background（背景图片） topmargin（上边距大小），leftmargin（左边距大小）

标题字标记h：

h1 -> h6 align属性，left、right、center、justify（两端对齐），块级标记

特殊字符：

&nbsp;" "
&lt;"<"
&gt;">"
&amp;"&"
&quot;双引号
&copy;大c版权
&reg;注册商标
&times;乘号
&divide;除号

文本修饰标记：

<b>粗体</b>
<i>斜体</i>
<u>下划线</u>
<del>删除线</del>
<sup>上标</sup>
<sub>下标</sub>
<strong>粗体</strong>
<em>斜体</em>
<small>变小字号</small>
<big>变大字号</big>

计算机输出标记：

<code></code> 定义计算机代码
<kbd></kbd>  定义键盘码
<samp></samp>  定义计算机代码样本
<tt></tt>  定义打字机代码
<var></var>  定义变量
<pre></pre>  定义预格式样本

引用和术语标记：

<abbr></abbr>定义缩写
<address></address>定义地址
<blockquote></blockquote>定义长的引用
<cite>sdada</cite>定义引用，引证
<q></q>定义短的引用语
<dfn></dfn>定义一个定义项目

font：

<font size="" color="" face="">
大小，颜色，字体，face可以取多个值，用逗号隔开，从左到右依次取值
</font>

其他

段落p：块级标记，不能再包含其他块级标记 align属性

br：换行

hr：水平线 <hr size="" width="" color="" align="">

ruby：拼音/音标

<ruby>
	中国<rt>zhong guo</rt>
	<!-- ruby与rt配套使用 -->
	内容<rt>拼音</rt>
	<!-- 对于不支持ruby的可以用rp标签放括号， 因为支持ruby的浏览器的rp标签为不可见，虽然好像有点不对劲哈-->
		中国<rt><rp>(</rp>zhong guo<rp>)</rp></rt>
</ruby>

blockquote：

<blockquote>
	块引用标记，引用内容向右缩进5格，内容周围增加外边距，可嵌套使用，两个缩进10格
</blockquote>

pre：完整保留所定义的格式

列表

<ul type="">
	<li type="">无序列表</li>
</ul>
<ol type="" start=""><!-- start改变列表起始数字 -->
	<li>有序列表</li>
	<li value="">改变当前列表项的值，并影响其后的列表项</li>
</ol>
<dl><!-- 定义列表，无符号无编号 -->
	<dt>项目1</dt>
		<dd>描述1</dd>
		<dd>描述2</dd>
		<dd>描述3</dd>
	<dt>项目2</dt>
		<dd>描述1</dd>
		<dd>描述2</dd>
		<dd>描述3</dd>
</dl>
<!-- 还有菜单列表，目录列表，不常用 -->

超链接

href：目标文件 name：规定锚的名称 title：指向链接的提示信息 target：指定打开的目标窗口 _self：在当前框架打开链接 _blank：在全新的空白窗口打开链接 _top：在顶层框架中打开链接，根框架 _parent：在当前框架的上一层打开链接 framename：在指定的框架或浮动框架内打开链接，框架名称可以自定义

超链接的分类：内部链接（相对路径），外部链接（绝对路径）创建电子邮件超链接创建页面书签链接，实现段落间的任意跳转

图像： <img src="" alt="">

src：图像url alt：图片不存在等时的替代文本 name，height，width，border：定义图像的名称，高宽，边框 hspace，vspace：图像左侧和右侧的留白，图像顶部和底部的留白 title：鼠标悬停时的提示信息 align：top、middle、bottom、left、center、right，规定如何根据周围的文本来排列图像，分水平、垂直两个方向

top：图像顶端与当前行文字顶端对齐，当前行高度相应扩大 middle：图像水平中线与当前行文字中线对齐，当前行高度相应扩大 bottom：图像底端与当前行文字底端对齐，当前行高度相应扩大 center：图像中线与当前行文字中线对齐，当前行高度相应扩大 left：图像左对齐，浮动游离于文字之外，文字环绕图像周围，文字行高没有任何变化 right：图像右对齐，浮动游离于文字之外，文字环绕图像周围，文字行高没有任何变化

usemap：将图像定义为客户器端图像映射

<img src="C:\Users\pipilm\Pictures\Saved Pictures\2-3.png" alt="hahah" title="dasd" usemap="#映射图像名称">
<map name="映射图像名称">
	<area shape="circle" coords="90,45,40" href ="new_file.html" alt="大大"  title="ss"/>
</map>

usemap的意思是使用map，map可以定义映射，area嵌套在map里，有三个属性shape、coords、href，用来定义区间的形状坐标和链接 shape=“rect”（矩形） coords=“x1,y1,x2,y2”（两个顶点坐标） shape="circle"（圆形） coords="x,y,r" （圆心坐标，半径） shape="poly" （多边形） coords="x1,y1,x2,x2...xi,yi,...xn,yn,x1,y1"（各顶点坐标，首尾相同，形成封闭图形）

滚动文字：<marquee></marquee>

onmouseover="this.stop()" 光标移动到滚动文字区域时暂停滚动 onmouseout="this.start()" 当鼠标移出滚动文字区域时，滚动内容将继续滚动 bgcolor：背景颜色 loop：滚动次数，-1为无限循环 direction：滚动方向，up、down、left、right behavior：滚动方式，scroll（循环往复滚动）slide（滚动一次就停止）alternate（来回交替滚动） scrollamount：滚动文字速度，越大越快 scrolldelay：延迟时间，以毫秒为单位，越小速度越快 width，height：滚动背景范围 hspace，vspace：滚动空白空间，滚动文字背景和周围的文字图像之间的空白空间范围

音频，视频及Flash文件：<embed></embed>

可以播放Midi、Mav、AIFF、SWF、AV、MP3、MOV、AVI等类型 width、height：宽高 src：媒体文件的路径 autostart：true（自动播放）、false（不自动播放） loop：true（循环），false（不循环）