首页 > 代码库 > Html简介2
Html简介2
1.表格标签
表格可以固定文本或图像的显示位置
<table></table>
属性：bgcolor:设置表格背景色、
border：设置表格边框宽度、
bordercolor：设置表格边框颜色、
bordercolorlight：设置表格边框明亮部分颜色、
bordercolordark：设置表格边框昏暗部分颜色、
cellspacing：设置表格单元格之间的间隔大小、
cellpadding：设置表格单元格边框与单元格内容间隔、
width：设置表格表格宽度、
height：设置表格表格高度
<tr></tr>
属性：align:设置水平方向上的对齐方式、
valign：设置垂直方向上的对齐方式、
bgcolor：设置行的背景色
<td></td>
属性：width：设置单元格宽度，单位为像素或表格总宽度百分比,
height：设置单元格高度
align：设置单元格水平方向上的对齐方式
valign：设置单元格垂直方向上的对齐方式
colspan：设置一个单元格所跨的列数，默认值是1
rowspan：设置一个单元格所跨的行数，默认值是1
nowrap：禁止浏览器对单元格中过长的内容进行换行，默认换行依据，-或空格或特殊字符
当单元格内容过长时，单元格会被撑大！
<th></th>
用法与<td></td>一样：粗体，居中
<caption></caption>:标题标签对，必须紧跟在<table></table>后面
2.帧标签
分帧的作用
将一个浏览器文档窗口分隔成多个窗口，每个窗口中都可以显示一个独立的网页文件
<frameset></frameset>标签
不能定义在<body></body>标签对中，及其中也不能定义<body></body>标签
属性：rows：设置每个帧的宽度
cols：设置每个帧的高度
border：设置每个帧窗口边框的宽度
frameborder：设置是否显示帧窗口的边框，缺省值为1[yes](显示),0[no](不显示)
必须设置其中的一个属性，否则会只显示第一个帧
<frame></frame>标签
属性：src：初始装载的网页的URL
name：帧窗口的名称，超链接的target指向这个name，就会在这个帧窗口中显示
scrolling：是否显示滚动条，默认是浏览器自动控制，no：始终不显示，yes：始终显示
noresize：禁止调整帧窗口的大小
<a href=http://www.mamicode.com/"">的target属性
四个内置的取值：_blank:在新窗口中显示，新窗口没有名称，脚本程序不能进行编程控制
_parent：当前帧的直接父帧窗口
_self:在原窗口中显示，默认设置值
_top：当前帧的最顶层的帧窗口
<noframes></noframes>标签:
用于在不支持frame的浏览器中显示文本，要在其中嵌入<body>标签对
<iframe></iframe>标签对
不需放在frameset中，放在<body>中，其中的内容只有在浏览器不支持iframe才显示
3.表格标签
<form>标签及其属性
<form></form>:用来创建一个表单，即定义表单的开始和结束位置
<form>标签具有action、method、target、title、enctype等属性
action属性：用来设置接收和处理浏览器递交的表单内容的服务器程序的URL
若没有设置或为空时，form表单所在网页的url就将当做默认值使用
method属性：用来定义浏览器将表单中的信息提交给服务器的处理程序的方式，取值可以为GET或POST,默认值为GET
get：显示参数，post：不显示参数
target属性：用来指定服务器返回结果显示的目标窗口或目标帧
title属性：用来设置当鼠标在表单上任意位置停留时，浏览器用黄色小浮标显示的文本(如表单的名称或描述)
enctype属性：指定浏览器使用哪种编码方式将表单传送给WWW服务器。
该属性可以有两种取值：application/x-www-form-urlencode：浏览器会将参数中的特殊字符先进行编码，再传递给服务器
和multipart/form-data：上传文件时，需要设置,默认的设置值是application/x-www-form-urlencode
注：from标签中的标签，只有设置了name属性，才会被提交
表单字段元素
<input type="submit" value=http://www.mamicode.com/"按钮显示值">:提交按钮
若也设置了name属性，该元素也会被提交给服务器
若有多个提交按钮都设置了name属性，只有被点击的按钮，才会被传递给服务器
<input type="reset">:重置按钮
点击时form中的标签都返回初始状态，该元素不会被提交给服务器
<input type="text"> :单行文本标签
size属性：文本框的大小
maxlength属性：可以输入的最大文本长度
readonly属性：可以获得焦点，不能手动改变其值，可以通过脚本改变其值
disabled属性：不可获取焦点，也不会被提交给服务器
<input type="checkbox">:复选框
属性：checked，value
若未被选中，不会传递给服务器，若没给value赋值，则默认为on
<input type="radio">:单选按钮
多个单选按钮，设置成相同的名称，提交时只提交被选中的单选按钮
<input type="hidden">:隐藏字段元素
浏览器不会显示，但是会被提交给服务器
<input type="password">密码输入区域
浏览器以*显示
<input type="file">文件上传
form标签的method设置为post,enctype设置为multipart/form-data
<input type="button">:普通类型按钮
要与脚本程序相联系，才能执行一定的
<input type="image">
在表单上创建一个图像元素,src代替value,可以代替提交按钮,单击图像时，会提交点击的x,y坐标以及form中的其他信息
<select></select><option></option>
<select>标签的属性：multiple：是否可以选择多项,ctrl+选择
size:设定在列表中可以看到的数目,默认值为1
<option>标签的属性：value：若被选中，value与select的name属性，传递给服务器,若没有设置value，则将option显示值传递给服务器
selected：初始化时是否选中
若多选时,传递多个value与select的name属性
若不想选择，则添加一个value=http://www.mamicode.com/""的option
<textarea></textarea>:多行文本框
属性：cols:列数
rows：行数
初始值放在<textarea></textarea>标签中
<lable>：快捷键设置
属性:for,accesskey
<lable for="user" accesskey="a">用户名</lable>
<input type="text" name="user" id="user"></input>
lable的for属性与input的id属性相对应
4.头元素
头元素是指位于<head></head>标签对之间的元素
主要包括<title></title>、<base>、<link>、<meta>标签
<title>网页的显示标题
<base>标签
<base>标签用于指定网页中的超链接的基准地址，以改变网页中所有使用相对地址的URL的基准地址。
<base>标签通常的使用形式如下：
<base href=http://www.mamicode.com/"http://www.it315.com/test" target="_blank">
作用：
href属性：设置该网页中所有使用HTTP协议的相对URL地址的基准地址，若网页中有如<a href=http://www.mamicode.com/"index.html">这样的超链接
它不会再像没有使用<base>标签式那样表示当前网页相同目录下的index.html，而是指向了http://www.it315.com/test/index.html
target属性：用于设定该网页中所有的超链接显示的目标窗口，在<base>标签中设定target属性，可省得在所有的超链接的<a>标签中都加上target属性
<link>标签
<link>标签定义了当前文档和另一个文档或资源之间的关系
几个主要的属性：
href：另一个文档或资源的url
rel与rev：定义link所连接的两个资源的关系类型，必须有其一
title：两个资源之间的关系或描述，可选
type：给出目标资源的mime类型
例如 type="text/css" type="text/javascript"
media:用于指定目标资源被接受的介质或媒体
设置值：screen：屏幕（缺省值），print（打印机）projection（投影机），aural（扬声器），braille（触摸仪器），
tty（电传打字机），tv（电视机），all（所有）等
若需要输出到多种介质上时，用逗号分隔设置多个值
rel与rev属性：描述连接的基本特征，连接类型
rel：连接源是在当前文档中定义的，herf定义连接目标
rev：连接目标是在当前文档中定义的，herf定义连接源
设置值：Contents,index,Glossary,Copyright,Next,Previous,Start,Help,Bookmark,Alternate,
Stylesheet(外部样式表)例如：<link rel="stylesheet" type="text/css" href=http://www.mamicode.com/"url">
Shortcut Icon(指向一个16*16图标.这个图标将替换地址栏和收藏夹里的默认图标)
例如：<link rel="Shortcut Icon" href=http://www.mamicode.com/"favion.ico">
<meta>标签
有两种类型的<meta>,用不同的属性名来划分，这两种属性名为：name和http-equiv
<meta name="某个设置值" content="对该设置值进行具体补充说明的信息">
<meta http-equiv="某个设置值" content="对该设置值进行具体补充说明的信息">
name属性用于在网页中加入一些关于网页的描述信息，例如网页的关键字（可供网页搜索引擎机器人查找、分类）、网页的描述信息等
http-equiv属性用于在HTML文档中模拟HTTP协议的响应消息头，例如，告诉浏览器是否缓存该网页、使用什么样的字符集来显示网页的内容、
隔多长时间自动刷新网页等等
Meta标签的name属性设置
Keywords：关键字，搜索引擎，搜索时依据的关键字，若有多个关键字，用逗号进行分割
例如：<meta name="keywords" content="c,java,c++">
Description：网页的简要描述，计入搜索引擎,若没有该属性时，会将网页开头的几行内容，计入搜索引擎
robots:用来告诉搜索引擎，搜索机器人可以对该页面进行哪些操作
设置值：index：可以检索和收录该页面（默认值）
noindex：不可以检索和收录该页面
follow：可以顺着该页面的超链接继续进行收录和检索
nofollow：不可以顺着该页面的超链接继续进行收录和检索
all：以上所有都可以
none：以上所有都不可以
Generator：编辑网页使用的工具
Author：作者
Copyright:版权声明
Meta标签的http-equiv属性设置
Content-Type：用来说明网页内容mime类型，以及文本内容使用字符集编码
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
Refresh头：用于告诉浏览器一段时间后，自动刷新或跳转到别的网页(可以在留言时跳转到某个页面)
<meta http-equiv="refresh" content="1;url=‘http://baidu.com‘">
若不指定url，则刷新自身网页
Expires头：网页过期时间
例如：<meta http-equiv="Expires" content="Mon,12 may 2001 00:20:00 GMT">
将content设置为0，可以禁止浏览器使用缓存页面
Windows-Target：强制网页在某个目标窗口中显示
例如：要防止自己的网页被别人当做一个frame页面调用，可以使用
<meta http-equiv="Windows-target" content="_top">
Pragma头：禁止浏览器缓存当前页面
例如：<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="Cache-control" content="no-cache">
Page-Enter和Page-Exit：网页进入或离开时的显示的特殊效果
例如：<meta http-equiv="Page-Enter" content="revealTrans(Transition=23,Duration="1.000")">
Transition:表示特殊效果的类型，Duration：效果持续的时间，单位为秒
5.分区标签
<div></div>块
<div>标签可以用来组合其它的HTML元素，但不能嵌套在段落元素中
如果嵌套，结果是不确定的。
<span></span>文本块
Html简介2