HTMl (Hyper Text Markup Language)基本标签
基本结构标签
<!--..-->注释标志,在"<!--"与"-->"之间的内容将不在浏览器中显示(指定了HTML文档遵循的文档类型定义)
<html>表示该文件为html文件
<head></head>包含文件的标题,使用脚本,样式定义等。
<title></title>包含文件的标题，标题出现在浏览器标题栏中
<h1></h1>最大的标题
<h6></h6>最小的标题
<u></u>下划线
<b></b>黑体字(指定文本应以粗体渲染)
<i><i>斜体字
<big></big>字体加大
<small></small>字体缩小
<tt></tt>打字机风格的字体;
<cite></cite>引用,通常是斜体
<em></em>强调文本(通常是斜体加黑体)
<strong></strong>加重文本(通常是斜体加黑体) 以粗体渲染文本 <pre></pre>预先格式化文本
<body></body>放置浏览器中显示的所有标志和属性,其中内容在浏览器中显示
<base></base>指定一个显示URL用于解析对外部源的链接和引用,如图像和样式表
<dir>引起目录列表
Document:代表给定浏览器窗口中的HTML文档
Event:代表事件状态,如事件发生的元素,键盘状态,鼠标状态和鼠标按钮状态
Fieldest:在字段集包含的文本和其它元素外面绘制一个方框
Isindex:使浏览器显示一个对话框,提示用户输入单行文本
<style>:代表了给定元素所有可能的内嵌样式的当前设置
Active :设置当链接处于激活状态时a元素的样式
Hover:设置当用户将鼠标指针悬停在链接上时a元素的样式
下所有标签用在<body></body>中:
<a herf="…"></a>:链接标志, "…"为链接的文件地址(创建超文本链接)(标明超链接的起始或目的的位置)
<a name="name"></a>创建位于文档内部的书签
<a href="#name"></a>创建指向文档内部书签的链接
<base></base>文档中不能被该站点辨识的其它所有链接源的URL
<link>定义一个链接和源之间的相互关系
<br>换行标志(换行,插入一个回车换行符)
<p></p>(段落标签)分段标志
<i></i>采用斜体字
<hr size="9",width="80%",color=’ff0000’>水平线
<b></b>采用黑体字(加粗文字标识的开始和结束)
<font></font>字体样式标志(文本标识的开始和结束)
属性:face=字体 color=颜色
Style=font-size:40px;用样式表方式控制字体的大小
<font size="",color=""></font>设置字体大小从1到7,颜色使用名字或RGB的十六进制值
<center></center>表示绝对居中
Border="…"，边框宽度
Bgcolor="…"背景色
Bordercolor="…"，边框颜色
Bordercolorlight="…",边框淡面的颜色
Bordercolordark="…"
基本属性：（属性是用来修饰标志的，属性放在开始标志内）
Cellpadding=数值单位是像素,定义表元内距
Cellspacting=数值单位是像素,定义表元间距
Border=数值单位是像素,定义表格背景图
Width=数值单位是像素或窗口百分比,定义表格背景图
Background=图片链接地址,定义表格背景图
(对齐属性)
Align=left,左对齐(缺省值),width=像素值或百分比,对象宽度
Align=center,居中，height=像素或百分比,对象高度
Aling=right，右对齐
(色彩属性)
Color=#RRGGBB，前景色
Bgcolor=#RRGGBB，背景色
<center>表示绝对居中
<div></div>,分区标识的开始和结束(用来排版大块的HTML段落,也用于格式化表)
属性:align=|center|left|right|水平对齐方式
<marquee></marquee>动态标识的开始和结束,如标识内放置贴图格式则可实现图片滚动
属性:srollamount=1-60,滚动速度
Direction=|left|right|up|down|,滚动方向
Scrolldelay=滚动延时,单位毫秒
<img src="…">，显示图片标志, "…"为图片的地址
属性:src=../../图片链接地址,贴图标识必备属性
Style=filter:Alpha(opacity=100,style=2)
Filter=样式表滤镜;
Alpha:透明滤镜;
Opacity:不透明滤镜100(0-100)
Style=样式2(0-3)
Rules="none"不显示内框"
<embed,src="…">多媒体文件标识
属性:src=".../../FILENAME",设定音乐文件的路径,文件类型除了可以播放.rm;.mp3;.wav等音频,还可播放.swf和.mov等视频
Autostart=true/false,是否要音乐文件传送完就自动播放,true是要,false是不要,默认为false
Loop= ,设定播放重复次数,loop=6表示重复6次,true或-1为无限循环,false为播放一次即停止
Startime="分:秒",设定乐曲的开始播放时间,如20秒后播放写为startime=00:20
Volume=0-100,设定音量的大小,如果没设定的话,就用系统的音量
Width,height:设置控制面板的大小,都设置为0可隐藏播放器
Hidden=true:隐藏控制面板
Controls=console/smallconsole:设置控制控制面板的样子
<bgsound src="…">,背景音乐标识,只能用于.wav和.mp3格式
表单标签:<form></form>表格标识的开始和结束,表单的内容都放在这里
下面的标签都放在表单内:<select></select>下拉选择框
<option></option>
Multiple,多选
<textarea></textarea>大量文字输入的编辑块.
属性:cols="",行; Rows="",列
<input> 创建各种表单输入控件
<input type="text">文本框
<input type="password">密码框
<input type="submit">提交按钮(创建一个按钮,该按钮单击后将提交表单)
<input type="checkbox">复选框
<input type="radio">单选框
<input type="reset">重置按钮(创建一个按钮,该按钮单击后将重置表单控件为其默认值)
<input type="image">图片按钮(创建一个图像控件,该控件单击后将导致表单立即被提交)
<input type="hidden">隐藏域(传输关于客户/服务器交互的状态信息)
<input type="button">按钮(指定其中所含的HTML要被渲染为一个按钮)
<input type="file">浏览文件
公共属性:Name="", Value="", Size=""
框架标签:<frameset></frameset>定义框架
<frame>,放在框架标签内,定义每个框架的内容
属性:cols="", Rows="",
Frameborder="",
Framespacing="",
Src="",
Scrolling="",滚动条(No,Yes)
Noresize,框架大小不可变
Marginhigh="",高度空余空间
Marginwidth="",高度空余空间
Target="",目标框架
<dl></dl>列表标签,定义列表
<dt>定义列表标题
<dd>定义列表内容
例如:
<dl>
<dt>标题</dt>
<dd>内容A</dd>
<dd>内容B</dd>
</dl>
<ol></ol>列表标签,定义一个标有数字的列表(有序列表)
<ul></ul>列表标签,定义一个标有圆点的列表(无序列表)
<li></li>列表项
其他标签
<bgsound>,背景音乐
Src=""
Loop="",循环次数
<embed>媒体播放块
Src=""
Loop="",循环次数
<marquee></marquee>滚动部分
属性:Bgcolor="",
Behavior,设置或获取文本如何在字幕中滚动,
Direction="",滚动方向
Height="", width=""
Loop="",循环次数
ScrollAmount="",设置或获取介于每个字幕绘制序列之间的文本滚动像素
scrollDelay="",设置或获取字幕滚动的速度
scrollHeight="",获取对象的滚动高度
scrollLeft="",设置或获取位于对象左边界和窗口中目前可见内容的最右端之间的距离
scrollTop="",设置或获取位于对象顶端和窗口中可见内容最顶端的距离
trueSpeed="",设置或获取字幕的位置是否使用scrollDelay和scrollAmount属性计算,已过的实际时间来自于时钟计时
标签注解
Target="…",决定链接源在什么地方显示(用户自定义的名字,blank,parent,self,top)
Ref="…"发送链接的类型
Rev="…"保存链接的类型
Accesskey="…"指定该元素的热键
Shape="…",允许我们使用已定义的形状定义客户端的图形镜像(default,rect,circle,poly)
Coord="…"使用像素或者长度百分比来定义形状的尺寸;
Tabindex="…"
使用定义过的tabindex元素设置在各个元素之间的焦点获取顺序(使用tab键使元素获得)
表格标签
属性: <table></table>定义表格,HTML中的重要标志(表格标识的开始和结束标签)
<tr></tr>定义表格的行,表格中的一个表格行的开始和结束,用在<table></table>中
<td></td>定义表格的单元格,表格中行内的一个单元格的开始和结束, 用在<tr></tr>中
<th></th>设置表格头:通常是黑体居中文字
<table Cellpadding="…">,设置表格格子边框与其内部内容之间空间的大小
<table cellspacing="…">,设置表格格子之间空间的大小
Cellpadding=数值单位是像素,定义表元内距(内容与边框的距离 默认为2)
Cellspacing=数值单位是像素，定义表元间距(内容与边框的距离 默认为2)
Border=数值单位是像素,定义表格边框宽度
Width=数值单位是像素或百分比，定义表格宽度
Height=定义表格的高度
Background=图片链接地址,定义表格背景图
colspan="…",单元格跨越多列，
Rowspan="…"，单元格跨越多行
<tr align="…">设计表格格子的水平对齐方式(left,center,right,justify)
<tr valign="…">设置表格格子的水平对齐方式(baseline,bottom,middle,top)
<td colspan="…">设置一个表格字跨占的列数(缺省值为1)
<td rowspan="…">设置一个表格格子跨占的行数(缺省值为1)
<td rowspan="…">禁止格子内的内容自动断行
<colgroup></colgroup>定义多个列为一组列
<col>定义一个列组中的列,以便对它们能够同时设置有关属性.
<tbody></tbody>定义一个表格的实体
<tfoot></tfoot>定义一个表格的页脚
Bordercolorlight="",边框明亮面的颜色;
Bordercolordark="",边框暗淡面的颜色;
表单标签
<form></form>创建表单
Action="…",接收数据的服务器URL
Method="…"HTTP的方法(get,post),其中get是被反对使用的
Enctype="…"指定MIME(Internet媒体类型)
Onsubmit="…"当提交表单时发生的内部事件
Noreset="…"在重新设置表单时发生的内部事件
Target="…"决定把内容显示在什么地方(blank parent self top)
<select multiple name="name"size=""></select>创建滚动菜单,size设置在需要滚动前可以看到的表单项目数目
<option></option>设置每个表单项的内容
<select name="name"></select>创建下拉菜单
<textarea name="name"cols=40,rows=8></textarea>创建一个文本框区域,列的数目设置宽度,行的数目设置高度
<input type="checkbox"name="name">,创建一个复选框,文字在标签后面
<input type="radio",name="name",value="">创建一个单选框,文字在标志后面
<input type=text name="foo"size=20>创建一个单行文本输入区域,size设置以字符串的宽度
<input type="submit"value="name">创建提交(subimt)按钮
<input type="image"border=0,name="name"src="name.gif">创建一个使用图像的提交按钮
<input type="reset">,创建重置(reset)按钮
<button></button>创建一个按钮
Disabled="…",把按钮的状态设置为不能
Name=按钮的控制名,value=按钮的值
Type="…"按钮类型(button submit reset)
<fieldset></fieldset>把互相关联的控件组合成一组
<isindex>提示用户输入
<label></label>为一个控件提供标签
<legend></legend>为fieldset元素指定一标题
<select></select>为用户做选择创建各个选项
<textarea></textarea>创建一个允许用户多行输入的区域
表单标签注释:
Type= "...",用于输入控件的类型
(text,password,checkbox,radio,submit,reset,file,hidden,image,button)
Name="..."控件的控制名(要求是除了submit和reset之外的任何名字)
Value="..."控件的初始值
Checked="...",把一个单选钮设置为选中的状态
Disabled="..."把控件的密码状态设置为不能使用
Readonly="..."只对输入密码的文本框使用
Size="..."表示以像素为单位的除了文本框和密码框控件之外的其它控件的宽度,它是用来指定字符的数目
Src="..."一个图像控件的URL
Maxlength="..."指定可以输入的最多的字符数目
Alt="..."另外一种文本描述
Usemap="..."到客户端图形镜像的URL
Align="..."被反对,控制对齐方式(left,center,right,justify)
Tabindex="..."通过定义tabindex值确定在不同元素之间获得焦点的顺序
Onfocus="..."当元素获得焦点时发生的事件
Onblur="..."当元素失去焦点时发生的事件
Onselect="..."当元素被选中时发生的事件
Onchang="..."当元素状态被改变时发生的事件
Accept="..."允许上载的文件类型
帧标签(框架标签)
<frameset></frameset>,放在一个帧文档<body>标签之前,也可以嵌在其他帧文档中;
<frameset rows="value,value">,定义一个帧内的行数,可用像素或高度百分百;
<frameset cols="value,value">,定义一个帧内的行数,可用像素或宽度百分比;
<frame>,定义一个帧内的单一窗或窗区域;
<noframes></noframes>,定义在不支持帧的浏览器中显示什么提示;
<frame src="URL">规定帧内显示的HTML文档;
<frame name="name">命名帧或区域以便别的帧可以指向它;
<frame marginwidth=" ">定义帧左右边缘的空白大小,必须大于等于1;
<frame marginheight=" ">定义帧上下边缘的空白大小,必须大于等于1;
<frame scrolling=" ">设置帧是否有滚动栏,其值可以是"yes"，"no"或"auto"。
<frame,noresize>,禁止用户调整一个帧的大小;
<iframe></iframe>创建一个内联的帧;
Scr=" "定义在帧中显示的内容的来源;
Frameborder="..." 定义帧之间的边界(0或1)
Align="..." 被反对,控制对齐方式(left,center,right,justify)
Height="..."帧的高度 width="..."帧的宽度
<!>跑马灯
<marquee></marquee>普通卷动(创建一个滚动的文本字幕)
<marquee behavior=slide></marquee>滑动
<marquee behavior=scroll></marquee>预设卷动
<marquee behavior=alternate></marquee>来回卷动
<marquee direction=up></marquee>向上卷动
<marquee direction=right></marquee>向右卷动
<marquee direction=left></marquee>向左卷动
<marquee loop=2></marquee>卷动次数
<marquee width=180></marquee>设定宽度
<marquee height=30></marquee>设定高度
<marquee bgcolor=FF0000></marquee>设定背景颜色
<marquee scrollamout=30></marquee>设定卷动时间
<marquee onmouseover="this.stop() "></marquee>鼠标经过上面时停止滚动
<marquee onmouseover=" this.start()"></marquee>鼠标离开时开始滚动
<img src=" ">插入图片,参数有:width="宽度" alt="说明文字"height="高"border="边框"
文档整体属性标签:
<body bgcolor=" ">设置背景颜色,使用名字或RGB的十六进制值
<body background=" ">设置背景图片
<body bgsound=" ">设置背景音乐
<body bgproperties="fixed">固定背景图片(IE适用)
<body text="">设置文本颜色,使用名字或RGB的十六进制值
<body link="">设置链接颜色,使用名字或RGB的十六进制值
<body vlink=" ">设置已使用的链接的颜色,使用名字或RGB的十六进制
<body alink="">设置正在被击中的链接的颜色,使用名字或RGB的十六进制值
<body topmargin=" ">设置页面上边距
<body leftmargin="">设置页面左边距
字体效果
<h1></h1>标题字(最大)
<h6></h6>标题字(最小)
<b></b>粗体
<strong></strong>粗体字(强调)
<i></i>斜体字
<em></em>斜体字(表示强调)
<dfn></dfn>斜体字(表示定义)
<u></u>底线
<ins></ins>底线(表示插入文字)
<strike></strike>横线
<s></s>删除线
<del></del>删除线(表示删除)
<u></u>底线
<ins></ins>底线(表示插入文字)
<strike></strike>横线
<s></s>删除线
<del></del>删除线(表示删除)
<kbd></kbd>键盘文字
<tt></tt>打字体
<xmp></xmp>固定宽度字体(在文件中空白 换行 定位功能有效)
<plaintext></plaintext>固定宽度字体(不执行标记符号)
<listing></listing>固定宽度小字体
<font color=00ff00></font>字体颜色
<font size=1></font>最小字体
<font style=" font-size:100px"></font>无限增大
区段标记
<hr>水平线
<hr size=9>水平线(设定大小)
<hr width=80%>水平线(设定宽度)
<hr color=ff0000>水平线(设定颜色)
<br>换行
<nobr></nobr>水域(不换行)
<p></p>水域(段落)
<center></center>居中
连结格式
<base href=位置>(预设好连结路径)
<a href=位置></a>外部连结
<a href=位置 target=’_blank’></a>外部连结(另开新视窗)
<a href=位置 target=’_top’></a>外部连结(全视窗连结)
<a href=位置 target=’_top’></a>外部连结(在指定页框连结)
贴图/音乐
<img src=图片位置>贴图
<img src=图片位置 width=’180’>设定图片宽度
<img src=图片位置 height=’30’>设定图片高度
<img src=图片位置 alt=’提示文字’>设定图片提示文字
<img src=图片位置 border=’1’>设定图片边框
<bgsound src=MID音乐文档位置>背景音乐设定
表格语法
<table aling=left></table>表格位置,置左
<table aling=center></table>表格位置,置中
<table background=图片路径></table>背景图片的URL=就是路径网址
<table bgcolor=颜色码></table>设定表格的背景颜色
<table borderclordark=颜色码></table>设定表格边框的颜色
<table borderclorlight=颜色码></table>设定表格亮边框的颜色
<table cellpadding=参数></table>指定内容与格线之间的间距(使用数字)
<table cellspacing=参数></table>指定格线与格线之间的距离(使用数字)
<table cols=参数></table>指定表格的栏数
<table frame=参数></table>指定表格边框线的显示方式
<table width=参数></table>指定表格的宽度大小(使用数字)
<table height=参数></table>指定表格的高度大小(使用数字)
<td colspan=参数></td>指定存储格合并栏的栏数(使用数字)
<td rowspan=参数></td>指定存储格合并列的列数(使用数字)
表示颜色的有三种方式:
1.16进制颜色代码
2.10进制RGB码
3.直接用颜色的英文名称
HTML结构
<html>
<head></head>
<body></body>
</html>
属性结构
属性名=”属性值”
href指定超链接所关联的另一个资源
target指定使用框架集中的哪个框架来装载另一个资源
绝对路径和相对路径
绝对路径(可以帮助准确无误判断一个文件的位置,它是完整的描述文件位置的路径)
相对路径(以一个目录为起点到你所想要找到的文件所在的目录,此外我们用”..\”来表示上一级目录)
总的来说(绝对路径是一个完整的路径,从开始即跟目录到最后你要找的文件所在目录,而相对位置是从半路开始
到你所想要找到的那个文件所在的目录。)
例如:假使F盘中有3个文件夹，分别为1,2,3，到你想要找的文件在“1”文件夹中，用A表示，则它的绝对路径就是F:\1\A,而相对路径为..\1
url中关于地址的解释：
http://zh.learnlayout.cn:8888/20150401/html基础1.html
scheme://host.domain:port/path/filename
Scheme指定因特网服务的类型，最流行的类型是http
Domain指定因特网域名，比如cxm.org
Host指定此域中的主机
Port指定主机的端口号
Path指定远程服务器上的路径
Filename指定远程文档的名称