marginwidth属性(margin属性4个值顺序)
大家好,关于marginwidth属性很多朋友都还不太明白,不过没关系,因为今天小编就来为大家分享关于margin属性4个值顺序的知识点,相信应该可以解决大家的一些困惑和问题,如果碰巧可以解决您的问题,还望关注下本站哦,希望对各位有所帮助!
iframe 属性
iframe元素的功能是在一个html内嵌一个文档,创建一个浮动的帧。iframe可以嵌在网页中的任意部分
name:内嵌帧名称
width:内嵌帧宽度(可用像素值或百分比)
height:内嵌帧高度(可用像素值或百分比)
frameborder:内嵌帧边框
marginwidth:帧内文本的左右页边距
marginheight:帧内文本的上下页边距
scrolling:是否出现滚动条(“auto”为自动,“yes”为显示,“no”为不显示)
src:内嵌入文件的地址
style:内嵌文档的样式(如设置文档背景等)
allowtransparency:是否允许透明
iframe还有一个很有用的用法:强调页面的某项内容
先把要强调显示的内容另存为一个文件,如first.htm,然后通过一个预载页index.htm,内容如下:
〈meta http-equiv="refresh" content="3,url=index2.htm"〉
〈body〉
页面加载中,请稍候……〈iframe src="first.htm" style="display:none"〉〈/iframe〉
〈/body〉
主文件index2.htm
〈body〉
〈iframe src="first.htm"加入其他属性限制〉〈/iframe〉
〈/body〉
解释成“浏览器中的浏览器“很是恰当
<iframe frameborder=0 width=170 height=100 marginheight=0 marginwidth=0 scrolling=no src="move-ad.htm"></iframe>
<IFRAME>用于设置文本或图形的浮动图文框或容器。
BORDER
<IFRAME BORDER="3"></IFRAME>
设定围绕图文框的边缘宽度
FRAMEBODER
<IFRAME FRAMEBODER="0"></IFRAME>
设置边框是不否为3维(0=否,1=是)
HEIGHT,WIDTH
<IFRAME HEIGHT="31" WIDTH="88"></IFRAME>
设质边框的宽度和高度
SCROLLING
<IFRAME SCROLLING="NO"></IFRAME>
是否有滚动条(YES,NO,AUTO)
SRC
<IFRAME SRC="GIRL.GIF"></IFRAME>
指定IFRAME调用的文件或图片(HTML,HTM,GIF,JPEG,JPG,PNG,TXT,*.*)
-------------------------------------------------------------
“画中画”效果--谈IFRAME标签的使用
纵观时下网站,本来网速就有些慢,可是几乎每页都要放什么Banner,栏目图片,版权等一大堆雷同的东西,当然,出于网站风格统一、广告效应的需要,本无可厚非,可毕竟让用户的钱包为这些“点缀“的东西”日益消得钱憔悴”了,有没有办法,让这些雷同的东西一次下载后就不用再下载,而只下载那些内容有变化区域的网页内容呢?
答案很肯定:应用Iframe标记!
一、Iframe标记的使用
提起Iframe,可能你早已将之扔到“被遗忘的角落”了,不过,说起其兄弟Frame就不会陌生了。Frame标记即帧标记,我们所说的多帧结构就是在一个浏览器窗口中显示多个HTML文件。现在,我们遇到一种很现实的情况:如有一个教程,是一节一节地上,每页末尾做一个“上一节“、“下一节“的链接,除了每节教程内容不同之外,页面其它部分内容都是相同的,如果一页一页地做笨页面,这似乎太让人厌烦了,这时突发奇想,如果有一种方法让页面其它地方不变,只将教程做成一页一页的内容页,不含其它内容,在点击上下翻页链接时,只改变教程内容部分,其它保持不变,这样,一是省时,另则以后如教程有个三长两短的变动,也很方便,不致于牵一发而动全军了;更重要的是将那些广告Banner、栏目列表、导航等几乎每页的都有的东西只下载一次后就不再下载了。 Iframe标记,又叫浮动帧标记,你可以用它将一个HTML文档嵌入在一个HTML中显示。它不同于Frame标记最大的特征即这个标记所引用的HTML文件不是与另外的HTML文件相互独立显示,而是可以直接嵌入在一个HTML文件中,与这个HTML文件内容相互融合,成为一个整体,另外,还可以多次在一个页面内显示同一内容,而不必重复写内容,一个形象的比喻即“画中画“电视。
现在我们谈一下Iframe标记的使用。
Iframe标记的使用格式是:
<Iframe src="URL" width="x" height="x" scrolling="[OPTION]" frameborder="x"></iframe>
src:文件的路径,既可是HTML文件,也可以是文本、ASP等;
width、height:"画中画"区域的宽与高;
scrolling:当SRC的指定的HTML文件在指定的区域不显不完时,滚动选项,如果设置为NO,则不出现滚动条;如为Auto:则自动出现滚动条;如为Yes,则显示;
FrameBorder:区域边框的宽度,为了让“画中画“与邻近的内容相融合,常设置为0。
比如:
<Iframe src="";; width="250" height="200" scrolling="no" frameborder="0"></iframe>
二、父窗体与浮动帧之间的相互控制在脚本语言与对象层次中,包含Iframe的窗口我们称之为父窗体,而浮动帧则称为子窗体,弄清这两者的关系很重要,因为要在父窗体中访问子窗体或相反都必须清楚对象层次,才能通过程序来访问并控制窗体。
1、在父窗体中访问并控制子窗体中的对象
在父窗体中,Iframe即子窗体是document对象的一个子对象,可以直接在脚本中访问子窗体中的对象。
现在就有一个问题,即,我们怎样来控制这个Iframe,这里需要讲一下Iframe对象。当我们给这个标记设置了ID属性后,就可通过文档对象模型DOM对Iframe所含的HTML进行一系列控制。
比如在example.htm里嵌入test.htm文件,并控制test.htm里一些标记对象:
<Iframe src="test.htm" id="test" width="250" height="200" scrolling="no" frameborder="0"></iframe>
test.htm文件代码为:
<html>
<body>
<h1 id="myH1">hello,my boy</h1>
</body>
</html>
如我们要改变ID号为myH1的H1标记里的文字为hello,my dear,则可用:
document.myH1.innerText="hello,my dear"(其中,document可省)
在example.htm文件中,Iframe标记对象所指的子窗体与一般的DHTML对象模型一致,对对象访问控制方式一样,就不再赘述。
2、在子窗体中访问并控制父窗体中对象
在子窗体中我们可以通过其parent即父(双亲)对象来访问父窗口中的对象。
如example.htm:
<html>
<body onclick="alert(tt.myH1.innerHTML)">
<Iframe name="tt" src="frame1.htm" width="250" height="200" scrolling="no" frameborder="0"></iframe>
<h1 id="myH2">hello,my wife</h1>
</body>
</html>
如果要在frame1.htm中访问ID号为myH2中的标题文字并将之改为"hello,my friend",我们就可以这样写:
parent.myH2.innerText="hello,my friend"
这里parent对象就代表当前窗体(example.htm所在窗体),要在子窗体中访问父窗体中的对象,无一例外都通过parent对象来进行。
Iframe虽然内嵌在另一个HTML文件中,但它保持相对的独立,是一个“独立王国“哟,在单一HTML中的特性同样适用于浮动帧中。
试想一下,通过Iframe标记,我们可将那些不变的内容以Iframe来表示,这样,不必重复写相同的内容,这有点象程序设计中的过程或函数,减省了多少繁琐的手工劳动!另外,至关重要的是,它使页面的修改更为可行,因为,不必因为版式的调整而修改每个页面,你只需修改一个父窗体的版式即可了。
有一点要注意,Nestscape浏览器不支持Iframe标记,但在时下IE的天下,这似乎也无大碍,广泛采用Iframe标记,既为自己(网站)着了想,又为网友节省了网费,何乐而不为?
例子:
<iframe src="页面" width="宽度" height="高度" align="排列可以是left或right,center" scrolling="是否有滚动条可以填no或yes"></iframe>
<IFRAME frameBorder=0 frameSpacing=0 height=25 marginHeight=0 marginWidth=0 scrolling=no name=main src="bgm/bgm.html" width=300></IFRAME>
2:::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
用了iframe后发现滚动条不漂亮想用2个图片来代替↑↓
应该怎么实现呢?
回答:
用下列代码替换网页的<title>..</title>
<SCRIPT LANGUAGE="javascript">
function scroll(n)
{temp=n;
Out1.scrollTop=Out1.scrollTop+temp;
if(temp==0) return;
setTimeout("scroll(temp)",80);
}
</SCRIPT>
<TABLE WIDTH="330">
<TR>
<TD WIDTH="304" VALIGN="TOP" ROWSPAN="2">
<DIV ID=Out1 STYLE="width:100%; height:100;overflow: hidden;border-style:dashed;border-width: 1px,1px,1px,1px;">
文字<BR>文字<BR>
文字<BR>
文字<BR>
文字
<BR>
<BR>
</DIV>
</TD>
<TD WIDTH="14" VALIGN="TOP"><IMG SRC="photo/up0605.gif" WIDTH="14" HEIGHT="20" onmouseover="scroll(-1)" onmouseout="scroll(0)" onmousedown="scroll(-3)" BORDER="0" ALT="按下鼠标速度会更快!"></TD>
</TR>
<TR>
<TD WIDTH="14" VALIGN="BOTTOM"><IMG SRC="photo/down0605.gif" onmouseover="scroll(1)" onmouseout="scroll(0)" onmousedown="scroll(3)" BORDER="0" WIDTH="15" HEIGHT="21" ALT="按下鼠标速度会更快!"></TD>
</TR>
</TABLE>
内框架Iframe的使用
使用Iframe可以在一人表格内调用一个外部文件,是非常有用的。本网站在很多页面上都使用了iframe效果。
现在我们学一下Iframe标记的使用。
Iframe标记的使用格式是:
<Iframe src="URL" width="x" height="x" scrolling="[OPTION]" frameborder="x" name="main"></iframe>
src:文件的路径,既可是HTML文件,也可以是文本、ASP等;
width、height:"内部框架"区域的宽与高;
scrolling:当SRC的指定的HTML文件在指定的区域不显不完时,滚动选项,如果设置为NO,则不出现滚动条;如为Auto:则自动出现滚动条;如为Yes,则显示;
FrameBorder:区域边框的宽度,为了让“内部框架“与邻近的内容相融合,常设置为0。
name:框架的名字,用来进行识别。
比如:
<Iframe src="" width="250" height="200" scrolling="Auto" frameborder="0" name="main"></iframe>
当你想用父框架控制内部框架时,可以使用: target="框架的名字"来控制。
Dreamweaver MX进阶教程(一)可视化操作iframe
iframe也称作嵌入式框架,嵌入式框架和框架网页类似,它可以把一个网页的框架和内容嵌入在现有的网页中。
从Dreamweaver MX开始,可以可视化操作iframe,不再需要第三方插件。
插入iframe
1.点击“插入面板”的“标签选择器”
.在“标签选择器”对话框中,选择iframe标签,点击“插入”按钮。
.在“标签编辑器-Iframe”对话框中,根据面板提示操作。最基本的两项是“源”和“名称”。
源:点击“浏览”按钮,选择要出现在iframe中的网页文件。
名称:输入的名称,将作为这个iframe的标识,其它的链接如果要在这个iframe打开,网页打开“目标”就需要输入此“名称”。
宽度和高度:可以输入象素值,也可以输入100%。
边距宽度和边距高度:设置和外围标签的边距。
对齐:设置对齐方式。
滚动:设置是否允许出现滚动条。
显示边框:选择是否出现边框。
设置链接在某个iframe中打开
选中链接,在属性面板中的“目标”项,手工输入目标iframe的“名称”。
iframe透明
为了使iframe内容和网页背景相同,需要使iframe透明。
在“标签编辑器-Iframe”对话框中,选择“浏览器特定的”项目卡,选中“允许透明”。
框架包含应用程序
在“标签编辑器-Iframe”对话框中,选择“浏览器特定的”项目卡,选中“框架包含应用程序”。
Iframe的替代内容
在某些不支持iframe的浏览器中,iframe将不能显示。这时需要输入替代内容。
在“标签编辑器-Iframe”对话框中,选择“替代内容”选项,在替代内容中输入代码或者文字。
html 标签 属性
详解HTML
标签和属性
在HTML中,通常标签都是由开始标签和结束标签组成的,开始标签用“<标签名>”表示,结束标签用“</标签名>”表示。
元素指的是包含标签在内的整体,除去标签的部分叫做内容。
属性要在开始标签中指定,用来表示该标签的性质和特性。通常都是以“属性名=”值””的形式来表示,用空格隔开后,还可以指定多个属性。指定多个属性时不用区分顺序
颜色的指定方法
用HTML指定颜色有两种方法
1、用16进制数值来指定:在#号的后面,把RGB的各个选项用十六进制的数值来表示,数值保持两位数。
2、指定颜色的名称:可以对基本的16色用名称来指定其颜色
指定文件的位置
在对某部分设置链接的时候,需要指定链接端HTML文件的位置;同样,如果想在该处显示图像也需要指定图像的位置。在HTML中,这个位置用URL来表示,有以下两种表示方法:
1、绝对URL:绝对URL就是用Web浏览器查看网页时,地址栏中显示的以http://开头的路径
2、相对URL:相对URL是在同一站点内进行设置,类似于在同一磁盘上管理文件的形式。这种方法是以当前文件的位置为基准。使用相对URL时,如果要指定的文件在当前文件的下级,就从目录名开始一直写到要指定的文件名,中间用“/”符号隔开。如果在当前文件的上级,每上一级就加一个“../”符号
2、基本内容
显示HTML的版本
<!DOCTYPE~>
HTML的版本表明HTML文件是按照哪个版本进行编写的(标明该HTML文件遵循的DTD文件),不同的版本和种类都有固定的书写格式,要按照固定的格式输入文件开头,然后在文件开头处写明版本,按照这种版本的规定格式进行编写
必须使用的标签
<html>~</html>
<head>~</head>
<title>~</title>
<body>~</body>
HTML文件的开头写有<!DOCTYPE~>的部分,代表HTML的版本,其后是必须存在的四种标签
首先,<!DOCTYPE~>后面的整个都要用html标签(<html>~</html>)括起来,其中要按照head标签(<head>~</head)和body标签的顺序(<body>~</body>)的顺序进行排列。
在head标签中填写与该文件相关的信息,body标签中填写世纪要在浏览器上显示的内容。另外,在head标签中,只能有一个代表文件标题的title标签
设置页面的文字颜色
<body text=”颜色指定”>~</body>
设置页面的背景颜色
<body bgcolor=”颜色指定”>~</body>
设置页面的背景图像
<body background=”图像的URL”>~</body>
按照目的设定范围
<div>~</div>
<span>~</span>
插入注释
<!—注释语句-->
3、设置文件信息
添加标题
<title>~</title>
title标签用来给HTML文件添加标题
这个标签一定要位于<head>~</head>圈定的范围内。在这里指定的标题除了可以在通常的浏览器窗口的标题栏中显示以外,还可以作为加入收藏夹时的标题
显示文件编码
<meta http-equiv="Content-Type" content="text/html; charset=文字编码"/>
meta标签的charset属性表示该HTML文件是用什么文字编码编写的
注意,该标签一定要位于<head>~</head>范围内
添加关键字、内容介绍及作者姓名
<meta name="keywords" content="关键字1,关键字2,…"/>
<meta name="description" content="内容介绍"/>
<meta name="author" content="作者姓名"/>
这些信息都不会在画面上显示出来,但是搜索引擎在收集信息时要用到
注意,该标签一定要位于<head>~</head>范围内
设置样式表和脚本语言的种类
<meta http-equiv="Content-Style-Type" content="样式表的种类"/>
<meta http-equiv="Content-Script-Type" content="脚本的种类"/>
在HTML文件内可以设置样式表和脚本的默认语言
注意,该标签一定要位于<head>~</head>范围内
设置进入网页
<link rel=”关系” href=”URL”>
<link rev=”关系” href=”URL”>
rel:在本页看到的,与URL标明的网页之间的关系
rev:在URL标明的网页中看到的,与本页之间的关系
link标签表示的是该文件和与其相关的其他文件之间的关系
注意,该标签一定要位于<head>~</head>范围内
设置标准URL
<base href=”绝对URL”>
<base href=”绝对URL” target=”目标名”>
base标签用来设置将该页中使用的相对URL的标准指向成绝对URL,指定了这个标签之后,在该页指定的相对URL就会全部认定为已在这里指定的绝对URL。如果不进行这项设置,就以当前页的位置为标准,如果指定了Target属性,就可以指定打开链接地址网页的默认框架和窗口
注意,该标签一定要位于<head>~</head>范围内
设置自动倒入网页功能
<meta http-equiv="refresh" content="秒数"/>
<meta http-equiv="refresh" content="秒数";URL=要移动到的URL/>
在经过数秒后,自动开始导入网页。如果指定了要移动到的URL,就会导入URL指定的网页。如果没有指定,就会再次导入相同的页
注意,该标签一定要位于<head>~</head>范围内
4、设置文本类型
设置各级标题
<h1>~<h1>
…
设置段落
<p>~</p>
p标签表示的是该部分为一个段落
设置联系地址
<address>~</address>
address标签表示的内容是该网页制作者的联系地址和有关网页内容的咨询地址等信息
设置强调内容
<em>~</em>
<strong>~</strong>
这两个标签所圈内容表示该部分是强调的内容
设置较短的引用文字
<q>~</q>
<q cite=”引用页的URL”>~</q>
q标签代表的意思是该部分为较短的引用文,在引用段落的某一部分的时候使用,如果使用cite属性,还能够把引用页的URL显示出来
设置较长的引用文章
<blockquote>~</blockquote>
<blockquote cite=”引用页的URL”>~</blockquote>
设置文字内容的出处
<cite>~</cite>
设置缩略语
<abbr title=”字符串”>~</abbr>
<acronym title=”字符串”>~</acronym>
title:不处于省略状态下的词汇(字符串)
设置添加的内容
<ins cite=”URL” datetime=”添加日期时间”>~</ins>
设置需要删除的内容
<de cite=”URL” datetime=”删除日期时间”>~</del>
突出显示段落中的术语
<dfn>~</dfn>
表示与程序关联的文本
<kbd>~</kbd>:输入文本
<samp>~</samp>:输出样本
<code>~</code>:源代码
<var>~</var>:变量
显示特殊符号
<:<
>:>
":”
&:&
5、设置显示方式
设置文字的换行
<br>
添加了br标签之后,文本就会再该处换行。即使在HTML代码中已经换行了,在浏览器上显示的时候却反映不出来,因此如果想在浏览器上换行的话,就要使用br标签
添加不同横线效果
<hr>
<hr size=”粗细” width=”长度” align=”对齐方式” noshade>
加入了hr标签后,就可以在其标注的地方显示横线
设置文本格式
<b>~</b>:黑体字
<i>~</i>:斜体字
<tt>~</tt>:等大字体
<sup>~</sup>:上标
<sub>~</sub>:下标
<u>~</u>:下划线
<s>~</s>:删除线
设置空格和换行
<pre>~</pre>
<pre>标签可以保留文字在源代码中的格式,使得页面中显示的内容和源代中的格式完全一致
设置居中效果
<center>~</center>
center标签用于将指定范围内的内容设置为居中
设置行对齐方式
<h1 align=”行对齐方式”>~<h1>
<p align=”行对齐方式”>~<p>
<div align=”行对齐方式”>~<div>
使用align属性可以设置标题、段落以及指定范围内的行对齐方式
设置文字颜色
<font color=”设置颜色”>~</font>
设置字体类型
<font>字体名”>~</font>
设置字体字号
<font size=”字号”>~</font>
相对改变字体大小
<big>~</big>:增大
<small>~</small>:减小
<font size=”+n”>:增大n号
<font size=”-n”>:减小n号
设置字号的基本大小
<basefont size=”字号”>
size:1~7
6、设置链接相关的属性
链接到其他页面
<a href=”链接目标URL”>~</a>
a标签的href属性能把指定的范围链接到其他页面上,链接部分的词语要设置得让人看到这个部分就能联想到链接网页上的具体内容
另外,在链接图像的时候,一定要插入替代的文字(alt=”~”)使用户能够很明确的了解到链接的目标
链接到当前页的特定位置
<a href=”#位置名”>~</a>:指定链接文件(从什么位置开始链接)
<a name=”位置名”>~</a>:指定链接的地址(要链接的位置)
如果一页上的内容非常多,可以在一个网页中给特定的位置命名,然后再链接到该位置(跳转)。在给链接对象位置命名的时候要使用name属性。然后,在链接的时候,要用href属性在链接地址名称的前面加上#号
设置链接到其他页面的特定位置
<a href=”URL#位置名”>~</a>:指定链接源(从什么位置开始链接)
<a name=”位置名”>~</a>:指定链接的地址(要链接的位置)
在链接到其他网页上的时候,可以先给那一页上特定的位置命名,然后链接到该位置。在给链接对象位置命名的时候要使用name属性。然后,在链接的时候,要用href属性设置成”URL+#+位置名”这样一种格式
设置链接文字的颜色
<body link=”指定颜色” vlink=”指定颜色” alink=”指定颜色”>~<body>
link:还没有看见的链接部分的文字颜色
vlink:已经看见的链接部分的文字颜色
alink:鼠标单击链接部分的文字颜色
body标签用于设置网页整体链接部分的文字颜色
在新窗口中打开链接网页
<a href=” URL” target=”窗口名”>~</a>
利用target属性可以设置打开链接窗口的方式
通过设置链接来启动邮箱
<a href=”mailto:邮箱地址”>~</a>
7、制作不同类型的列表
为列表添加不同类型的标记
<ul><li>列表项目1</li><><li>列表项目2</li>…<ul>
ul标签的作用是将列表(条款形式)加上圆点或方括号的标记。列表的整体要在<ul>~</ul>标签范围内,在这之间的各个项目要在<li>~</li>标签之内
更改列表标记
<ul type=”标记种类”>~</ul>
<li type=”标记种类”>~</li>
标记的种类包括disc、cicle和square
制作带序号的列表
<ol><li>列表项目1</li><><li>列表项目2</li>…<ol>
改变序号的样式
<ol type=”序号样式”>~</ol>
<li type=”序号样式”>~</li>
改变序号的顺序
<ol start=”开始序号”>~</ol>
<li value=”开始序号”>~</li>
制作包含专用语和解释的列表
<dl><dt>专用语<dt><dd>对其解释</dd>…<dl>
8、设置表格
表格的基本形式
<table border=”边框的粗度”>~</table>:整个表格
<tr>~</tr>:单独一行
<th>~</th>:单元格:标题用
<td>~</td>:单元格:数据用
表格的整体要圈在<table>~</table>之间显示,表格当中某一个单元格用<th>~</th>表示或者<td>~</td>表示。每个单元格都在表的单独以行,放置在<tr>~</tr>中。也就是说,table标签的内容是由tr标签构成的。各个tr标签的内容是由表示单元格的th或者td标签构成的。th标签代表这个单元格的内容是标题。td标签代表这个单元格的内容是数据
为表格添加标题
<caption>~</caption>
<caption align=”对齐方式”>~</caption>
caption标签用来给表格添加标题
该标签一定要放在table标签的紧后面。标题的显示位置(即对齐方式)可以指定在表格的上部,或者表格的下部
指定表格的大小
<table width=”宽度”>~</table>
宽度:针对像素或者窗口的百分比
指定单元格大小
<th width=”宽度” height=”高度”>~</th>
<td width=”宽度” height=”高度”>~</td>
合并单元格
<th rowspan=”垂直方向的合并数”>~</th>
<th colspan=”水平方向的合并数”>~</th>
<td rowspan=”垂直方向的合并数”>~</td>
<td colspan=”水平方向的合并数”>~</td>
垂直方向的合并数:从当前单元格开始向下合并的单元格数
水平方向的合并数:从当前单元格开始向右合并的单元格数
设置单元格之间的距离
<table cellspacing=”单元格的距离”>~</table>
设置单元格边框与内容之间的距离
<table cellpadding=”单元格边框与内容之间的距离”>~</table>
设置单元格中的行对齐方式和列对齐方式
align属性用于设置单元格内的行对齐方式,valign属性用来设置单元格内的列对齐方式
禁止在单元格内换行
<th nowrap>~</th>
<td nowrap>~</td>
设置表格和单元格的背景颜色
bgcolor属性用于指定表格和单元格中的背景颜色
设置表格和单元格的背景图像
background属性用于指定表格和单元格中的背景图像
设置表格外框的宽度
<table border=”外框的宽度”>~</table>
设置表格外框的显示形式
<table frame=”外框的显示形式”>~</table>
设置表格内补边框线的显示形式
<table rules=”内部边框线的显示形式”>~</table>
定义表格中的横行
<thead>~</thead>:表头部分
<tbody>~</tbody>:表体部分
<tfoot>~</tfoot>:表底部分
thead标签、tbody标签和tfoot标签都是用来定义表格的横行(tr标签)的
这样组合之后,就可以针对该组合的整体来应用属性和样式表。
使用这些标签的时候,一定要以thead标签、tfoot标签和tbody标签的顺序进行排列。在一个表格里,只能放置一个thead标签和一个tfoot标签,而tbody标签可以根据需要放置多个
利用纵列设置表格属性和样式表
<col span=”纵列数”>
<col span=”纵列数” width=”宽度”>
col标签不仅可以用来改变表格的纵列结构,还可以用来根据纵列,来综合指定宽和行对齐方式等属性以及样式表
该标签放置的位置要在caption标签的紧后面(如果没有caption标签,就放在table标签的开始标签的紧后面),以及thead标签和tr标签的前面
设置表格居中
<table align=”center”>~</table>
将表格嵌入到文本中
<table align=”对齐方式”>~</table>
位置:left,right
将table标签的align属性指定为left或者right后,就可以将表格以居左或居右的方式嵌入到文字中间
如果想要解除嵌入状态,可以使用<br>标签的clear属性
解除表格的嵌套
<br clear=”解除表格那一侧的嵌套”>
left:解除左侧表格的嵌套
right:解除右侧表格的嵌套
all:解除两侧表格的嵌套
设置表格与嵌套文字之间的距离
<table vspace=”垂直距离” hspace=”水平距离”>~</table>
垂直距离:表格的上下框与文字间的距离
水平距离:表格的左右框与文字间的距离
9、设置图像与多媒体
插入图像
<img src=”URL” width=”宽度” hignt=”高度” alt=”替代文字”>
使用img标签,可以把图像插入到HTML文件中
图像的格式一般可以使用GIF格式、JPEG格式和PNG格式
不管图像实际的大小如何,都会按照在这里所指定的宽度和高度来显示
alt属性是在不能显示图像的情况下,指定替代图像所使用的文字
设置图像的边框
<img src=”URL” alt=”替代文字” border=”边框的粗度”>
设置图像与文字的垂直位置关系
<img src=”URL” alt=”替代文字” align=”对齐方式”>
在同一行中,如果有图像和文字,那么就可以用align属性来设置图像和文字的垂直位置关系
制作图像热区
<img src=”URL” alt=”替代文字” usemap=”#map名”>
<map name=”map名”>~</map>
<area shape=”形状” cords=”坐标” href=”URL” alt=”替代文字”>
在map标签中,用来设置实际单击的区域和链接地址的是area标签
在area标签中,一定要指定表示链接地址的替代文字,之后要用image标签的usemap属性指定定义后的image map的名称(名称前面要加#),这样图像就可以作为image map产生相应的效果
将图像嵌套在文本中
<img src=”URL” alt=”替代文字” align=”对齐方式”>
位置:left,right
解除图像的嵌套
<br clear=”解除哪一侧图像的嵌套”>
设置图像与周围文字之间的距离
<img src=”URL” alt=”替代文字” vspace=”垂直距离” hspace=”水平距离”>
放置Java小程序
<applet code=”类文件名” width=”宽度” height=”高度”>~</applet>
<param name=”参数名” value=”参数值”>
applet标签是嵌入Java小程序时要使用的标签
如果使用param标签,在执行java小程序时,需事先指定一些必要值。这时,param标签要位于<applet>~</applet>范围的最开始部分
10、制作不同类型的表单
制作填写表单
<form action=”URL” method=”发送形式” enctype=”MIME类型” target=”窗口名称”>~</form>
URL:用来处理发送后表格的程序的URL
发送形式:get,post
MIME类型:以post方式发送内容时的MIME类型
窗口名称:先是发送结果的窗口或框架名
form标签表示在表单中填写的内容是可以发送的
制作发送按钮
<input type=”submit” value=”标签” name=”名称”>
标签:在按钮上显示的文字
名称:按钮的名称
将input标签的type属性设置为submit,再根据form标签的设置,可以制作发送填写在表单中数据的按钮
制作重置按钮
<input type=”reset” value=”标签”>
制作通用按钮
<input type=”button” name=”名称” value=”标签”>
通用按钮通常与JavaScript等脚本语言组合使用
利用图像来制作发送按钮
<input type=”image” src=”URL” name=”名称” alt=”替代文字” align=”对齐方式”>
通常,发送按钮都使用input type=”submit”代码,不过图像也可以作为发送按钮,具有发送功能。这时,图像被单击的位置将和表单的内容一起被发送
制作不同功能的发送按钮
<button type=”类型” name=”名称” value=”发送值”>~</button>
类型:submit,reset,button
button标签是用来制作按钮专用的
通过指定type属性值,就可以产生具有不同功能的按钮,包括发送按钮、重置按钮和通用按钮。另外,在<button>~</button>中放置相应的内容,可以作为按钮的标签显示出来。在需要进行其他处理并设置多个发送按钮的情况下,根据name属性和value属性所显示的值,接受方就可以分辨出单击的是哪一个发送按钮
制作单行文本框
<input type=”text” name=”名称” value=”默认文字” size=”宽度” maxlength=”字符的最大输入数量”>
制作多行文本框
<textarea name=”名称” rows=”行数” cols=”宽度”>~</textarea>
制作输入密码的文本框
<input type=”password” name=”名称” value=”默认文字” size=”宽度” maxlength=”字符的最大输入数量”>
插入隐藏域
<input type=”hidden” name=”名称” value=”发送值”>
制作单选按钮
<input type=”radio” name=”名称” value=”发送文字”>
<input type=”radio” name=”名称” value=”发送文字” checked>
将input标签的type属性设置为radio,可以用来制作单选按钮。单选按钮是多个选项当中只能选择其一的按钮。作为公共项目的选项而使用的单选按钮,要把它们都指定为同一名称。另外,发送数据的时候,为了识别所选的是哪一项,要用value属性来指定相应的值
制作复选框
<input type=”checkbox” name=”名称” value=”发送文字”>
<input type=” checkbox” name=”名称” value=”发送文字” checked>
将input标签的type属性设置为checkbox,可以用来制作复选框。复选框可以在多个选项当中进行多项选择。作为公共项目的选项而使用的复选框,要把它们都指定为同一名称。另外,发送数据的时候,为了识别所选的是哪一项,要用value属性来指定相应的值
制作菜单
<select name=”名称”>~</select>:菜单整体
<option value=”发送值”>~</option>:菜单项
<option selected>~</option>:菜单项
select标签用来制作菜单
菜单的整体要在<select>~</select>范围之内显示,然后按需要的数量在其中放置表示选项的<option>~</option>。<option>~</option>范围之内要写上实际菜单要显示的选项的名称。另外,如果省略了value属性,在这里记录的文字本身就会作为所选值发送
组合菜单选项
<optgroup lable=”组合名称”>~</optgroup>:制作组合菜单
<option lable=”次选项”>~</option>:组合内的选项
组合名称:第一级显示的组合标题
次选项:对应组合名称下面的在第二级显示出来的选项
制作的菜单选项可以利用<select>~</select>标签组合起来
制作下拉列表
<select size=”行数” name=”名称” multiple>~</select>:下拉列表框
<option value=”发送值”>~</option>:菜单项
<option selected>~</option>:菜单项
在用于制作菜单的select标签中指定了size属性后,就可以显示下拉列表框
添加选择文件的功能
<input type=”file” name=”名称”accept=”MIME”类型>
将input标签的type属性设置为file,可以自动做成能够选择发送表单数据的文件按钮和文本框
综合利用菜单选项
<fieldset>~</fieldset>:组合
<legend align=”对齐方式”>~</legend>:组合的标题
field标签用来把填写在表单中需要包含的输入内容和选项组合起来
在<fieldset>~</fieldset>的最开始部分放置legend标签,并且给该组合加上标题
将标签文字与项目一体化
<label for=”参照ID”>~</lable>
参照ID:添加了标签的对象的id属性值
lable标签的作用是在输入项和选项及其标签文字之间建立起明确的关联,并使其一体化
11、利用框架布局网页
设置框架整体结构
<frameset rows=”高度”>~</frameset>
<frameset cols=”宽度”>~</frameset>
<frame src=”URL” name=”框架名称”>
高度:在垂直方向上分布的多个框架的高度,按从上到下的顺序依次用逗号隔开来指定
宽度:在水平方向上分布的多个框架的宽度,按从左到右的顺序依次用逗号隔开来指定
URL:作为框架内容显示的HTML文件的URL
框架名称:在指定链接等显示目标的时候使用的名称
使用框架功能可以把窗口横竖切割开,然后在不同的块区域中显示其他的HTML文件。在指定了框架的文件中,原来body标签所在的位置,要放置frameset标签,这主要是由于在框架页面中不能使用body标签
在<frameset>~</frameset>的范围中要按照顺序填入分割后框架内要填写的内容。如果不需要再分割,就用frame标签指定要导入的HTML文件,如果还要继续分割的话,就需要放置frameset标签(作为嵌套放置在里面,并且指定盖框架如何分割)
设置框架的显示方法
<frame scrolling=”滚动控制” noresize>
<frame marginwidth=”左右缩进” marginheight=”上下缩进”>
设置是否显示边框
<frame frameborder=”显示指定框架的边框”>
frameborder属性用来设置分割开相邻框架的边框是否显示
去除分割框架的边框
<frameset frameborder=”0” framespacing=”0” border=”0”>
在不支持框架的环境中显示所需内容
<noframes>~</noframes>
这个标签要在<frameset>~</frameset>范围的最开始或者最后处放置一个。在<noframes>~</noframes>范围内要首先放置body标签,并在其中填写所要显示的内容。
指定链接目标在哪一个框架内显示
<a href=”URL” target=”框架名”>~</a>
如果对框架内的文件中指定的链接不进行设置的话,就会在原来的相同框架中显示链接目标,如果想使这个链接目标在其他框架中显示的话,就需要指定target属性值,用想要显示(frame标签)的那个框架的name属性来指定框架名称
插入内嵌框架
<iframe src=”内容的URL” name=”框架名”>~</iframe>
iframe标签不仅可以放置分割窗口形式的框架,还可以在窗口中放置独立显示的内嵌框架。在框架内还可以显示src属性所指定的内容
如果浏览器不支持这种框架,要在<iframe>~</iframe>之间指定要显示的内容
12、关于脚本
在HTML中插入脚本
<script type=”MME类型”>~</script>
<script type=”MME类型” language=”语言名称” src=”URL”>~</script>
在HTML文件中编写脚本的时候要用到script标签,脚本语言要写在这个标签的范围内
这时,在不支持这个标签的浏览器上会在画面上显示出脚本的部分,为了避免这种现象,通常把脚本整体作为HTML的注释。这个标签可以放在<head>~</head>和<body>~</body>范围内的任意位置上
在不能执行脚本的环境中添加所需的内容
<noscript>~</noscript>
在脚本不能运行的时候,可以使用noscript标签来指定替代显示的内容
这个标签要放置在<body>~</body>的范围内
html中的标签的target是做什么用的
<a>标签的 target属性规定在何处打开链接文档。
如果在一个<a>标签内包含一个 target属性,浏览器将会载入和显示用这个标签的 href属性命名的、名称与这个目标吻合的框架或者窗口中的文档。
如果这个指定名称或 id的框架或者窗口不存在,浏览器将打开一个新的窗口,给这个窗口一个指定的标记,然后将新的文档载入那个窗口。从此以后,超链接文档就可以指向这个新的窗口。
在框架中打开窗口
不用打开一个完整的浏览器窗口,使用 target更通常的方法是在一个<frameset>显示中将超链接内容定向到一个或者多个框架中。可以将这个内容列表放入一个带有两个框架的文档的其中一个框架中,并用这个相邻的框架来显示选定的文档
请注意,在文档"toc.html"中,每个链接的目标都是"view_frame",也就是右边的框架。
当用户从左边框架中的目录中选择一个链接时,浏览器会将这个关联的文档载入并显示在右边这个"view_frame"框架中。当其他链接被选中时,右边这个框架中的内容也会发生变化,而左边这个框架始终保持不变。
扩展资料html中特殊的目标(注意事项)
有 4个保留的目标名称用作特殊的文档重定向操作:
_blank
浏览器总在一个新打开、未命名的窗口中载入目标文档。
_self
这个目标的值对所有没有指定目标的<a>标签是默认目标,它使得目标文档载入并显示在相同的框架或者窗口中作为源文档。这个目标是多余且不必要的,除非和文档标题<base>标签中的 target属性一起使用。
_parent
这个目标使得文档载入父窗口或者包含来超链接引用的框架的框架集。如果这个引用是在窗口或者在顶级框架中,那么它与目标 _self等效。
_top
这个目标使得文档载入包含这个超链接的窗口,用 _top目标将会清除所有被包含的框架并将文档载入整个浏览器窗口。
提示:这些 target的所有 4个值都以下划线开始。任何其他用一个下划线作为开头的窗口或者目标都会被浏览器忽略,因此,不要将下划线作为文档中定义的任何框架 name或 id的第一个字符。
参考资料
百度百科——HTML
如果你还想了解更多这方面的信息,记得收藏关注本站。