版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领
文档简介
网页设计HTML基础西安协同教育HTML是什么1、HTML的由来——
早在web未发明之前,SGML(StandardGeneralizedMarkupLanguage——标准通用标记语言)就早已存在,它包含DTD(文档类型定义),因而具有可扩展性。但SGML十分庞大,不易学习和使用,在计算机上实现也很困难。鉴于这些因素,web的发明者们根据当时(1989年)计算机技术的能力,提出了HTML语言。西安协同教育2、HTML——
是一个按SGML定义的语言; 是一种描述性语言; 是采用作标记定义文本及图像等元素的特殊格式; 是由浏览器解释并显示的。HTML是什么西安协同教育标记写法任何标记皆由"<"及">"所围住,如<P>标记名与小于号之间不能留有空白字符。某些标记要加上参数,某些则不必。如<fontsize="+2">Hello</font>参数只可加于起始标记中。在起始标记之标记名前加上符号"/"便是其终结标记,如</font>标记字母大小写皆可。西安协同教育围堵标记与空标记围堵标记
顾名思义,它以起始标记及终结标记将文字围住,令其达到预期显示效果。例如HTMLSource:<b>CreationofWebpage</b>ismyfavourite.
显示成:CreationofWebpageismyfavourite.
其中<b></b>便称为围堵标记。
它以起始标记<b>及终结标记</b>标示文字Creationofwebpage,令它显示成粗体,两者失其一都会发生错误显示。西安协同教育空标记
是指标记单独出现,只有起始标记没有终结标记。例如HTMLSource:
IloveCreationofWebpage.<br>It'sawonderfulplace.
显示成:
IloveCreationofWebpage.
It'sawonderfulplace.其中换行标记<br>便属空标记。
它的作用便是将标记后所有东西显示于下一行,可见终结标记于它是没意义的,但有些人会为空标记加上终结标记,这是为方便记认而己,对HTML没有影响。西安协同教育第一个HTML文件<HTML><HEAD><TITLE>第一个页面</TITLE></HEAD><BODY>
我的第一个HTML页面</BODY></HTML>西安协同教育HTML文件HTML文件特点文件分两部分,由<HEAD>至</HEAD>称为开头,<BODY>至</BODY>称本文。
基本上两者各有适用的标记,如<TITLE>只可出现于开头部分。开头部分用以存载重要资讯,而只有本文部分会被显示。
所以大部分标记会运用于本文部分。<TITLE>所标示的是文件的标题。
会出现于浏览器顶部及为别人Bookmark时的名称,所以每页有不同而明确的标题是需要的。HEAD该标签的内容不在浏览器中显示其中主要用于保存域该HTML文件本身相关的各种信息比如<TITLE>则是该文件的名称,通常显示在浏览器的标题栏中整份文件处于标记<HTML>与</HTML>之间。
<HTML>用以声明这是HTML文件,让浏览器认出并正确处理此HTML文件。西安协同教育文件标记
西安协同教育排版标记
西安协同教育字体标记
西安协同教育字体标记西安协同教育清单标记
西安协同教育表格标记
西安协同教育表单标记
西安协同教育框架标记
西安协同教育其余标记西安协同教育BODY<BODY text="#000000" link="#0000FF" alink="#FF0000" vlink="#0000FF" background="bg1.gif" bgcolor="#FFFFFF" leftmargin=2 topmargin=2 bgproperties="fixed“>西安协同教育BODYtext=“#000000”
用以设定文字颜色。#000000代表黑色,亦可以采用颜色的名称,即text=“black”。link=“#0000FF”
设定一般文字连结颜色。alink=“#FF0000”
设定刚按下时文字连结颜色。vlink=“#0000FF”
设定连结后的颜色。(被按过)。background=“bg1.gif”
设定背景墙纸。GIF或JPEG皆可,可以是绝对途径或相对途径。西安协同教育BODYbgcolor="#FFFFFF"
设定背景颜色。当己设定背景墙纸时会失去作用,除非墙纸有透明部分。leftmargin=2
设定整份文件显示画面的左方边沿空间,单位为像素。『只适用于IE』topmargin=2
设定整份文件显示画面的上方边沿空间。『只适用于IE』bgproperties="fixed"
固定背景墙纸,当卷动文字时墙纸不会跟著卷动。『只适用于IE』西安协同教育调色原理HTML的颜色表示可分两种:以命名方式定义常用的颜色,如RED。以RGB值表示,如#FF0000表示red。RGB方式众所皆知颜色是由"red""green""blue"三原色组合而成的,在HTML中对於彩度的定义是采十六进位的,对於三原色HTML分别给予两个十六进位去定义,也就是每个原色可有256种彩度,故此三原色可混合成一千六佰多万的颜色。西安协同教育调色原理例如
白色的组成是red=ff,green=ff,blue=ff,RGB值即为ffffff
红色的组成是red=ff,green=00,blue=00,RGB值即为ff0000
绿色的组成是red=00,green=ff,blue=00,RGB值即为00ff00
蓝色的组成是red=00,green=00,blue=ff,RGB值即为0000ff
黑色的组成是red=00,green=00,blue=00,RGB值即为000000於应用时常在每个RGB值之前加上符号#以示分别,但不加亦可。西安协同教育调色原理西安协同教育调色原理西安协同教育<!--注解-->:像很多电脑语言一样,HTML文件亦提供注解功能。浏览器会忽略此标记中的文字(可以是很多行)而不作显示,一般使用目的:为文中不同部份加上说明,方便日后修改。
这对较复杂或非私人网页尤其重要,它不单是提醒自已,亦提醒你的同事这部分做什么、那部分做什么。
例子:
<!--由这处开始是产品订购表格-->用作版权声明。
假如你不希望别人使用或复制你的网页,可加上警告字眼。
例子:
<!--本文版权为1998,CreationofWebpage所拥有,未经许,请勿抄摘-->西安协同教育排版标记<P><BR><HR><CENTER><PRE><DIV><NOBR><WBR>西安协同教育<P><P>称为段落标记。作用:为字、画、表格等之间留一空白行。本来<P>是一围堵标记,标于一段落的头尾,但从HTML2.0开始己不需要</P>作结尾。<P>的常用参数:如:<palign="center">align="center"
可选值:right,left,center。
内定值:align="left"西安协同教育<P>示例西安协同教育<BR><BR>称为换行标记。作用:令字、画、表格等显示于下一行。由于浏览器会自动忽略原始码中空白和换行的部分,这令到<BR>成为最常用的标记之一。因为无论你在原始码中编好了多漂亮的文章,若不适当地加上换行标记或段落标记,浏览器只会将它显示成一大段。西安协同教育<BR>错误的示例566EBostonPostRD
MamaroneckNY10543-9982
UnitedStatesofAmerica西安协同教育<BR>正确的示例566EBostonPostRD
<BR>MamaroneckNY10543-9982
<BR>UnitedStatesofAmerica西安协同教育<HR><HR>称为水平线。作用:插入一条水平线。<HR>之参数修改:
以:<HRalign="LEFT"size="2"width="70%"color="#0000FF"noshade>为例。align="LEFT"
设定线条置放位置,可选择:left;right;center三种设定值。size="2"
设定线条厚度,以像素作单位,内定为2。width="70%"
设定线条长度,可以是绝对值(以像素作单位)或相对值,内定为100%。color="#0000FF"『只适用于IE』
设定线条颜色,内定为黑色。#0000FF代表蓝色,亦可以采用颜色的名称,即text="blue"。noshade
设定线条为平面显示,若删去则具阴影或立体,这是内定值。西安协同教育<HR>示例<HR>
<HRalign="LEFT"size="4">
<HRalign="LEFT"size="2"width="70%"color="#0000FF"noshade>
<HRalign="LEFT"size="4"width="70"color="#008000">西安协同教育<CENTER><CENTER>称为居中标记。作用:令字、画、表格等显示于中间。这标记原先是Netscape所定义,后来其它浏览器都支持它,但你会发现很多标记已有align=“CENTER”的参数,<CENTER>似乎多馀了,事实上它还是常用的标记之一,其简单易用,常用于文字上,对于己加有align=“CENTER”参数的<TABLE>标记亦要不厌其烦地加上居中标记,因有较多浏览器不支持<TABLE>标记中的align="CENTER"参数。西安协同教育<CENTER><CENTER>Chris'sFirstHomepage</CENTER>
<CENTER>What'snew</CENTER>
<CENTER>Myprofile</CENTER>西安协同教育<PRE><PRE>称为预设格式标记。作用:令文件按照原始码的排列方式显示。这标记允许保留你于原始码中输入的空白及Return。细看以下例子你便可体会到此标记的威力。除了运用一大堆表格标记之外你只有采用这标记才能有此效果。西安协同教育<PRE><pre>CreationofWebpageLogAnalysisIComposerLearning459407480522547586673HTMLAdvanced200268296358385453506</pre>西安协同教育<DIV><DIV>称为区隔标记。作用:设定字、画、表格等的摆放位置。<DIV>应用于StyleSheet(式样表)方面会更显威力,它最终目的是给设计者另一种组织能力,有Class;Style;title;ID等属性,将会于【StyleSheet】一节才作详述,这处只介绍一个属性设定。
以<DIValign="center">为例:align="center"
可选值:center;left;right。决定字、画、表格等居中、靠左或靠右。
<DIValign="center">的作用和居中标记<CENTER>一样,前者是由HTML3.0开始的标准,后者是通用己久的标示法。西安协同教育<DIV><DIValign="center">Chris'sFirstHomepage
<br>What'snew
<br>Myprofile</DIV>西安协同教育字体标记<STRONG><B>
<I><EM><VAR><CITE><DFN><ADDRESS>
<TT><SAMP><CODE><KBD><U><STRIKE><BIG><SMALL><SUP><SUB>
<H1><H2><H3><H4><H5><H6>
<FONT><BASEFONT>
西安协同教育<STRONG><B>两者皆能产生字体加粗的效果CreationofWebpage
<br><STRONG>CreationofWebpage</STRONG>
<br><B>CreationofWebpage</B>西安协同教育<I><EM><VAR><CITE><DFN><ADDRESS>这些标记于InternetExplorer都产生斜体效果,这些标记中只有<ADDRESS>较为特别,因它包括换行效果所以不必在它前面加上<BR>标记西安协同教育示例<I>CreationofWebpage</I>
<br><EM>CreationofWebpage</EM>
<br><VAR>CreationofWebpage</VAR>
<br><CITE>CreationofWebpage</CITE>
<br><DFN>CreationofWebpage</DFN>
<ADDRESS>CreationofWebpage</ADDRESS>西安协同教育<U><STRIKE><BIG><SMALL><SUP><SUB>
<U>是加底线的标记,一些特别的浏览器并不支援,因顾虑到与连结混淆。<STRIKE>加上删除线的标记。<BIG>令字体加大。<SMALL>令字体变细。<SUB>为下标字,<SUP>则为上标字,仅剩的数学标记。西安协同教育示例CreationofWebpage
<br><TT>CreationofWebpage</TT>
<br><SAMP>CreationofWebpage</SAMP>
<br><CODE>CreationofWebpage</CODE>
<br><KBD>CreationofWebpage</KBD>
<br><U>CreationofWebpage</U>
<br><STRIKE>CreationofWebpage</STRIKE>
<br><BIG>CreationofWebpage</BIG>
<br><SMALL>CreationofWebpage</SMALL>
<br>12345<SUB>7</SUB>6789<SUP>9</SUP>西安协同教育<H1><H2><H3><H4><H5><H6>这些是标题标记,由<H1>至<H6>变粗变大加宽的程度逐渐减小。每个标题标记所标示的字句将独占一行且上下留一空白行。<H1>HeaderLevel1</H1>
<H2>HeaderLevel2</H2>
<H3>HeaderLevel3</H3>
<H4>HeaderLevel4</H4>
<H5>HeaderLevel5</H5>
<H6>HeaderLevel6</H6>西安协同教育示例西安协同教育<FONT><BASEFONT>这两个标记具参数设定,且两者的参数设定是一样的,都是负责设定文字的大小、字形及颜色<BASEFONT>可以用于文件的开头部分,即<HEAD>与</HEAD>之间的位置,将影响全文字句,是一个空标记,用以改变字体显示的内定值。
<FONT>是应用于文件的内文部分,即<BODY>与</BODY>之间的位置,只影响所标示的字句,是一个围堵标记。两标记可同时存在,唯没被<FONT>所标示的字句才直接受<BASEFONT>所影响,而<FONT>本身亦受<BASEFONT>的影响。西安协同教育<FONT><fontface="Arial"size="+2"color="#008000“>CreationofWebpage</font>face="Arial"
设定文字的字形。Arial是常用的一种,请不要使用Window内建字形以外的字形。于没有设定为Gb2312Encoding的中文网页,NetscapeNetvigator
不会显示此标记所指明的任何中文字形。size="+2"
设定文字的大小。其值可以是绝对或相对,
绝对的意思便是标记自己决定文字的大小,不受<BASEFONT>的影响,如
size="5"表示其大小便是5,而html内定值为3,即size="3"和没有设定是一样的。
相对的意思便是在内定值3的基础上增加或减少大小级数,如size="+2"便等同绝对表示法的size="5",但若已设定<BASEFONTsize="n">则其实际大小便是n+2不再是3+2了。<BASEFONT>只有绝对表示法。color="#008000"
设定文字的颜色。#008000表示绿色西安协同教育<FONT><fontsize="+1">IloveCreationofWebpage</font>
<br><fontsize="+2"color="#800080">IloveCreationofWebpage</font>
<br><fontface="TimesNewRoman"size="5"color="#008000">IloveCreationofWebpage</font>西安协同教育清单标记或者列表标记<OL><LI><UL><MENU><DIR><DL><DT><DD>西安协同教育<OL><LI><OL>称为顺序清单标记。所谓顺序清单就是在每一项前面加上1,2,3...等数目,又称编号清单<LI>则用以标示清单项目。
西安协同教育<OL><ol type="i“ start="4"></ol>type="i"
设定数目款式,其值有五种,请参考右表,内定为type="1"。start="4"
设定开始数目,不论设定了哪一数目款式,其值只能是1,2,3..等整数,内定为start="1"。西安协同教育<LI><litype="square"value="4">type="square"
只适用于非顺序清单,设定符号款式,其值有三种,如下,内定为type="disc":
符号●是当type="disc"时的列项符号。
符号○是当type="circle"时的列项符号。
符号■是当type="square"时的列项符号。value="4"
只适用于顺序清单,设定该一项的数目,其後各项将以此作为起始数目而递增,但前面各项则不受影响,其值只能是1,2,3..等整数,没有内定值。西安协同教育<LI>Mybestfriends:
<ol>
<li>MichelleWei
<li>MichaelWan
<li>GloriaLam
</ol>西安协同教育<UL><UL>称为无序清单标记。
所谓无序清单就是在每一项前面加上○、■、●
等符号,故又称符号清单。<ULtype="square">type="square"
设定符号款式,其值有三种,如下,内定为type="disc":
符号●是当type="disc"时的列项符号。
符号○是当type="circle"时的列项符号。
符号■是当type="square"时的列项符号。西安协同教育示例MyHomepages:
<ul>
<li>PenpalsGarden
<li>ICQGarden
<li>SoftwareCity
<li>CreationofWebpage
</ul>
西安协同教育<DL><DT><DD><DL>称为定义清单标记。<DT>用以标示定义条目,<DD>则用以标示定义内容。所谓定义清单就是一种分二层的项目清单,三个标记都没有常用的参数。而<DT><DD>可以独立使用,只是一些旧的浏览器并不支援,如IE3.0。常用的如<DD>标记可用以制造段落第一个字前面的空白。西安协同教育示例<dl>
<dt>HowtouseDefinitionList
<dd>First,youshouldnotplaceparagraphtagrightafterorbeforealiststructureorbetweentheitemsofalist.Incerntaincontexts,useofextraparagraphtagsshouldalwaysbeavoided,whenyourealizethisconcept,itisquiteasytowriteaHTML.
<dt>Otherthingstoknow
<dd>WeusuallyputonlyONEDefinitiontagfollowingtheDefinitionTermtag,morethanoneDDtagisnotrecommanded.Besides,unlikeDefinitionListisanonemptytag,bothDefinitionTermandDefinitionDescriptionareemptytags.
</dl>西安协同教育示例西安协同教育链接标记<A><BASE>西安协同教育<A><A>称连结标记,由<A>与</A>所围的文字、图片等等可以成为一个连结。<A>的一般参数设定:例如<ahref="index.html"name="hello"target="_top">西安协同教育<href属性>href="index.html"
这参数不能与另一参数name同时使用,使用这参数才能造成可按的连结。当作为一外部连结时:
href
所设定的是该连结所要连到的文件名称,若该文件与此html档不是同在一目录请加上适当的路径,相对绝对皆可。当作为一内部连结时:
href
所设定的是该连结所要连到的同文件内参考点或指定文件之参考点,且不要包围任何字画只加上结束标示</a>便可以,例如
<ahref=“#there”></a>、
<ahref=“index.html#there”></a>
及
<ahref=".hk/~chris55/index.html#there"></a>
其中there便是参考点,并於其前加上符号#以作识别,参考点由下一个参数name事先於文件中埋下。西安协同教育Name属性name="hello"
这参数是为文件埋下参考点,作为被连结,不会被显示。所以说造成一个内部连结要使用两次<A>连结标记。一个使用参数name事先於文件中埋下一参考点,另一个使用参数href
连到这个参考点。西安协同教育TARGET属性target="_top"
设定连结被按後之结果所要显示的视窗。可选值为:_blank,_parent,_self,_top,框窗名称。target="框窗名称"
这只运用於框架中,若被设定则连结结果将显示於该“框窗名称”之框窗中,框窗名称是事先由框架标记所命名。target="_blank"或target="new"
将连结的画面内容,开在新的浏览视窗中。target="_parent"
将连结的画面内容,当成文件的上一个画面。target="_self"
将连结的画面内容,显示在目前的视窗中。(内定值)target="_top"
将框架中连结的画面内容,显示在没有框架的视窗中。(即除去了框架)西安协同教育示例1<ahref="/xdjyzx/">现代教育中心</a>
<p><ahref="">
<img
src="sdjtu.gif"width=212height=60border=1alt="现代教育中心"></a>
<p><ahref="">
<img
src="sdjtu.gif"width=212height=60border=0alt="现代教育中心"></a>西安协同教育示例1西安协同教育内部连接<aname="test"></a>
<ahref="#test">本页的内部连结</a>
<br><ahref=".hk/~chi/faq.html#14">跳到PenPalGarden的FAQ部分</a>西安协同教育<BASE><BASE>是一个连结基准标记,用以改变文件中所有连结标记的参数内定值。它只能应用於文件的开头部分,即标记<HEAD>与</HEAD>之间。<BASE>的一般参数设定:例如<basehref="/"target="_top">西安协同教育<BASE>href="/"
设定该页网页中所有HTTP文件及图形(包括相对路径连结及<IMG>图形标记等)的内定路径,其他如ftp://及gopher://等则不受影响。这参数只可填入一个相对或绝对的路径,不必填入档案名称。一般相对路径连结及<IMG>图形标记等是内定以该页网页所在的目录作为起点,若依这例子,该文件中所有连结将会以/作为起点,若其中有连结如<ahref="index.html">BacktoMainPage</a>,那末它不会连到自已目录下的index.html,它将会连到Microsoft的首页,这是因为相对路径己给<BASE>转成绝对的了。target="_top"
设定该页网页中所有连结被按後之结果所要显示的视窗,免得分别为所有连结加上target参数,常应用於框架中。其设定与<A>连结标记中target参数相同。西安协同教育图形标记<IMG>IMG>称图形标记,主要用以插入图片于网页中<IMG>的一般参数设定:例如<img
src="logo.gif"width=100height=100
hspace=5
vspace=5border=2align="top"alt="LogoofPenPalsGarden" lowsrc="pre_logo.gif">西安协同教育图片<IMG>src="logo.gif"
图片来源,接受.gif,.jpg及.png
格式,前两者通行己久,后者由96年开始发展,于未来取代前两者。若图片文件与该html文件同处一目录则只写上文件案名称,否则必须加上正确的途径,相对及绝对皆可。width=100height=100
设定图片大小,此宽度、及高度一般采用pixels作单位。通常只设为图片的真实大小以免失真,若要改变图片大小最好事先使用图像编辑工具。hspace=5vspace=5
设定图片边沿空白,以免文字或其它图片过于贴近。hspace
是设定图片左右的空间,vspace
则是设定图片上下的空间,高度采用pixels作单位。border=2
图片边框厚度。西安协同教育图片<IMG>align="top"
调整图片旁边文字的位置,你可以控制文字出现在图片的偏上方、中间、底端、左右等,可选值:top,middle,bottom,left,right,内定为bottom。alt="LogoofPenPalGarden"
这是用以描述该图形的文字,若用者使用文字浏览器,由于不支持图片,这些文字更会代替图片而被显示。若于支持图片显示的浏览器,当鼠标移至图片上该些文字亦会显示。lowsrc="pre_logo.gif"
设定先显示低解像图片,若所加入的是一张很大的图片,下载时很长,这张低解像图片会先被显示以免浏览失却兴趣,通当是原图片灰阶版本。西安协同教育示例<img
src="girl.gif"width=100height=112border=0alt="beautifulgirl">普通插入西安协同教育示例<img
src="girl.gif"width=100height=112border=0alt="beautiful"hspace=10vspace=20">设定上下左右空白位置西安协同教育示例<img
src="girl.gif"width=100height=112border=4alt="beautiful"hspace=10vspace=20">设定上下左右空白位置西安协同教育示例<img
src="girl.gif"width=100height=112alt="beautifullady"align="right"border=0>设定图片靠右。西安协同教育示例<img
src="girl.gif"width=200height=220alt="I'mnotbeautifulrightnow"border=0>放大了的图片西安协同教育框架标记<FRAMESET><FRAME><NOFRAMES><IFRAME>西安协同教育框架概念所谓框架便是网页画面分成几个框窗,同时取得多个URL。只要<FRAMESET><FRAME>即可,而所有框架标记要放在一个总起的html档,这个档案只记录了该框架如何划分,不会显示任何资料,所以不必放入<BODY>标记,浏览这框架必须读取这档案而不是其它框窗的档案。<FRAMESET>是用以划分框窗,每一框窗由一个<FRAME>标记所标示,<FRAME>必须在<FRAMESET>范围中使用。如下例:<framesetcols="50%,*"><framename="hello"src="up2u.html"><framename="hi"src="me2.html"></frameset>此例中<FRAMESET>把画面分成左右两相等部分,左便是显示up2u.html,右边则会显示me2.html这档案,<FRAME>标记所标示的框窗永远是按由上而下、由左至右的次序。西安协同教育<FRAMESET><FRAMESET>称框架标记,用以宣告HTML文件为框架模式,并设定视窗如何分割。
<FRAME>则只是设定某一个框窗内的参数属性。<FRAMESET>参数设定:
例子:<framesetrows="90,*"
frameborder="0"border=0
framespacing="2"
bordercolor="#008000">西安协同教育属性COLS="90,*"
垂直切割画面(如分左右两个画面),接受整数值、百分数,*则代表占用馀下空间。数值的个数代表分成的视窗数目且以逗号分隔。例如COLS="30,*,50%"可以切成三个视窗,第一个视窗是30pixels的宽度,为一绝对分割,第二个视窗是当分配完第一及第三个视窗後剩下的空间,第三个视窗则占整个画面的50%宽度为一相对分割。您可自己调整数字。ROWS="120,*"
就是横向切割,将画面上下分开,数值设定同上。唯COLS与ROWS两参数尽量不要同在一个<FRAMESET>标记中,因Netacape
偶然不能显示这类形的框架,尽采用多重分割。frameborder=“0”
设定框架的边框,其值只有0和1,0表示不要边框,1表示要显示边框。(避免使用yes或no)border="0"
设定框架的边框厚度,以pixels为单位。bordercolor="#008000"
设定框架的边框颜色。framespacing="5"
表示框架与框架间的保留空白的距离西安协同教育FRAME<FRAME>参数设定:
例子:<framename="top"
src="a.html"
marginwidth="5"
marginheight="5"scrolling="Auto"
frameborder="0"
noresize
framespacing="6"
bordercolor="#0000FF">西安协同教育属性SRC="a.html"
设定此框窗中要显示的网页档案名称,每个框窗一定要对应著一个网页档案。你可使用绝对路径或相对路径,有关此两者详见於【连结进阶】。NAME="top"
设定这个框窗的名称,这样才能指定框架来作连结,必须但任意命名。frameborder=0
设定框架的边框,其值只有0和1,0表示不要边框,1表示要显示边框。(避免使用yes或no)framespacing="6"
表示框架与框架间的保留空白的距离。bordercolor="#008000"
设定框架的边框颜色。颜色值请参考【HTML剖析】。scrolling="Auto"
设定是否要显示卷轴,YES表示要显示卷轴,NO表示无论如何都不要显示,AUTO是视情况显示。noresize
设定不让使用者可以改变这个框框的大小,亦没有设定此参数,使用者可以很随意地拉动框架,改变其大小。marginhight=5
表示框架高度部份边缘所保留的空间。marginwidth=5
表示框架宽度部份边缘所保留的空间。西安协同教育示例<framesetrows="80,*"> <framename="top"src="a.html"> <framename="bottom"src="b.html">
</frameset>西安协同教育示例<framesetrows="80,*,80"> <framename="top"src="a.html"> <framename="middle"src="b.html"> <framename="bottom"src="c.html">
</frameset>西安协同教育示例<framesetcols="150,*">
<framesetrows="80,*"> <framename="upper_left"src="a.html"> <framename="lower_left"src="b.html">
</frameset> <framename="right"src="c.html">
</frameset>西安协同教育示例<framesetrows="80,*"> <framename="top"src="a.html">
<framesetcols="150,*"> <framename="lower_left"src="b.html"> <framename="lower_right"src="c.html">
</frameset>
</frameset>西安协同教育示例<framesetcols="150,*"><framename="left"src="a.html">
<framesetrows="80,*"><framename="upper_right"src="b.html"><framename="lower_right"src="c.html">
</frameset>
</frameset>西安协同教育<NOFRAMES>当别人使用的浏览器太旧,不支援框架这个功能时,他看到的将会是一片空白。为了避免这种情况,可使用<NOFRAMES>这个标记,当使用者的浏览器看不到框架时,他就会看到<NOFRAMES>与</NOFRAMES>之间的内容,而不是一片空白。这些内容可以是提醒浏览转用新的浏览器的字句,甚至是一个没有框架的网页或能自动切换至没有框架的版本亦可。应用方法:
在<frameset>标记范围加入</NOFRAMES>标记,以下是一个例子:<framesetrows="80,*"><noframes>
<body>
很抱歉,馈下使用的浏览器不支援框架功能,请转用新的浏览器。
</body>
</noframes><framename="top"src="a.html"><framename="bottom"src="b.html"></frameset>若浏览器支援框架,那堋它不会理会<noframes>中的东西,但若浏览器不支援框架,由於不认识所有框架标记,不明的标记会被略过,标记包围的东西便被解读出来,所以放在<noframes>范围内的文字会被显示。西安协同教育<IFRAME>它的作用是在一页网页中间插入一个框窗以显示另一个文件。它是一个围堵标记,但围著的字句只有在浏览器不支援iframe
标记时才会显示,如<noframes>一样,可以放些提醒字句之类。通常iframe
配合一个辨认浏览器的JavaScript会较好,若JavaScript认出该浏览器并非InternetExplorer便会切换至另一版本。<iframe>的参数设定如下:
例子:<iframe
src="iframe.html"name="test"align="MIDDLE"width="300"height="100"
marginwidth="1"
marginheight="1"
frameborder="1"scrolling="Yes">西安协同教育属性src="iframe.html"
欲显示於此框窗的文件来源除档案名称,必要加上相对或绝对路径。name="test"
此框窗名称,这是连结标记的target参数所要的,align="MIDDLE"
可选值为left,right,top,middle,bottom,作用不大width="300"height="100"
框窗的宽及长,以pixels为单位。marginwidth="1"marginheight="1"
该插入的文件与框边所保留的空间。frameborder="1"
使用1表示显示边框,0则不显示。(可以是yes或no)scrolling="Yes"
使用Yes表示容许卷动(内定),No则不容许卷动。西安协同教育示例<center><iframe
src="/"name="test"align="MIDDLE"width="450"height="200"marginwidth="5"marginheight="5"frameborder="1">
很抱歉,馈下使用的浏览器并不支援IFrame,不能正常浏览我的网页。</iframe>
</center>
西安协同教育表格标记<TABLE><TR><TD><TH><CAPTION>西安协同教育<TABLE><TR><TD><TABLE>是一个容器标记,意思是说它用以声明这是表格而且其他表格标记只能在他的范围内才适用,属容器标记的还有其他。<TR>用以表示表格列(row)<TD>用以表示行中的单元格(cell)西安协同教育<TABLE>的参数设定<TABLE>的参数设定(常用):
例如:<tablewidth="400"border="1"
cellspacing="2"
cellpadding="2"align="CENTER"
valign="TOP"background="myweb.gif"
bgcolor="#0000FF"
bordercolor="#FF00FF"
bordercolorlight="#00FF00"
bordercolordark="#00FFFF"cols="2“>西安协同教育表格属性width="400"
表格宽度,接受绝对值(如80)及相对值(如80%)。border="1"
表格边框厚度,不同浏览器有不同的内定值,故请指明。cellspacing="2"
表格格线厚度,请看例子三,那是加厚到5的格线。cellpadding="2"
文字与格线的距离,请看例子四,那是加至10的padding。align="CENTER"
表格的摆放位置(水平),可选值为:left,right,center,请看例子五或六,那表格是放于中间的,为怕一些浏览器不支援,故特加上居中标记<CENTER>,只是多层保证而己,当然只用<CENTER>亦可。valign="TOP".
表格内字画等的摆放贴位置(垂直),可选值为:top,middle,bottom。西安协同教育表格属性background="myweb.gif"
表格纸,与bgcolor
不要同用。bgcolor="#0000FF"
表格底色,与background不要同用,请看例子六。bordercolor="#FF00FF"
表格边框颜色,NC与IE有不同的效果,请看例子六。bordercolorlight="#00FF00"
表格边框向光部分的颜色,请看例子二。『只适用于IE』bordercolordark="#00FFFF"
表格边框背光部分的颜色,请看例子二,使用bordercolorlight
或bordercolordark
时bordercolor
将会失效。『只适用于IE』cols="2"
表格栏位数目,只是让浏览器在下载表格是先画出整个表格而己。西安协同教育<TR>的参数设定(常用)<TR>的参数设定(常用)
例如:<tralign="RIGHT"
valign="MIDDLE"
bgcolor="#0000FF"
bordercolor="#FF00FF"
bordercolorlight="#808080"
bordercolordark="#FF0000“>西安协同教育<TR>属性align=“RIGHT”
该一行内字画等的摆放贴位置(水平),可选值为:left,center,right。valign=“MIDDLE”
该一行内字画等的摆放贴位置(垂直),可选值为:top,middle,bottom。bgcolor="#0000FF"
该一列底色,请看例子五。bordercolor="#FF00FF"
该一列边框颜色,请看例子三。『只适用于IE』bordercolorlight="#808080"
该一列边框向光部分的颜色,请看例子三。『只适用于IE』bordercolordark="#FF0000"
该一列边框背光部分的颜色,请看例子三,使用bordercolorlight
或bordercolordark
时bordercolor
将会失效。『只适用于IE』西安协同教育TD>的参数设定TD>的参数设定(常用):
例如:<tdwidth="48%"height="400"
colspan="5"
rowspan="4"align="RIGHT"
valign="BOTTOM"
bgcolor="#FF00FF"
bordercolor="#808080"
bordercolorlight="#FF0000"
bordercolordark="#00FF00"background="myweb.gif“>西安协同教育TD属性width="48%"
该一储存格宽度,接受绝对值(如80)及相对值(如80%)。height="400"
该一储存格高度。colspan="5"
该一储存格向右打通的栏数。请看例子六rowspan="4"
该一储存格向下打通的列数。请看例子六align="RIGHT"
该一储存格内字画等的摆放贴位置(水平),可选值为:left,center,right。西安协同教育TD属性valign="BOTTOM"
该一储存格内字画等的摆放贴位置(垂直),可选值为:top,middle,bottom。bgcolor="#FF00FF"
该一储存格底色,请看例子四。bordercolor="#808080"
该一储存格边框颜色,请看例子三。『只适用于IE』bordercolorlight="#FF0000"
该一储存格边框向光部分的颜色,请看例子三。『只适用于IE』bordercolordark="#00FF00"
该一储存格边框背光部分的颜色,请看例子三,使用bordercolorlight
或bordercolordark
时bordercolor
将会失效。『只适用于IE』background="myweb.gif"
该一储存格纸,与bgcolor
任用其一。西安协同教育示例<tablewidth="60%"border="1">
<tr><td>只有一个储存格(cell)的表格</td></tr>
</table>西安协同教育示例<tablewidth="60%"border="5"bordercolorlight="#FF00FF"bordercolordark="#FF0000">
<tr><td>第一列第一栏</td><td>第一列第二栏</td></tr>
</table>西安协同教育示例<tablewidth="60%"border="1"cellspacing="5">
<tr
bordercolor="#0000FF"><td>第一列第一栏</td><td>第一列第二栏</td>
</tr>
<tr
bordercolorlight="#FF00FF"bordercolordark="#00FF00"><td>第二列第一栏</td><td>第二列第二栏</td>
</tr>
</table>西安协同教育示例<tablewidth="60%"border="1"cellpadding="10">
<tr><tdbgcolor="#FFCCE6">第一列第一栏</td><tdbgcolor="#FFFFC6">第一列第二栏</td>
</tr>
<tr><tdbgcolor="#FFD9FF">第二列第一栏</td><tdbgcolor="#DAB4B4">第二列第二栏</td>
</tr>
</table>西安协同教育示例<center>
<tablewidth="60%"cellspacing="0"cellpadding="2"align="CENTER">
<tr><tdbgcolor="#FFD2E9">第一列第一栏</td><tdbgcolor="#FFDAB5">第一列第二栏</td><tdbgcolor="#FFFFB5">第一列第三栏</td>
</tr>
<tr
bgcolor="#C0C0C0"><td>第二列第一栏</td><td>第二列第二栏</td><td>第二列第三栏</td>
</tr>
</table>
</center>
西安协同教育示例<center>
<tablewidth="350"border="1"cellspacing="0"cellpadding="2"align="CENTER"bgcolor="#FFC4E1"bordercolor="#0000FF">
<tr><td>第一列第一栏</td><tdcolspan="2">第一列之第二栏及第三栏</td>
</tr>
<tr><tdrowspan="2">第二列及第三列之第一栏</td><td>第二列第二栏</td><td>第二列第三栏</td>
</tr>
<tr><td>第三列第二栏</td><td>第三列第三栏</td>
</tr>
</table>
</center>西安协同教育<TH><TH>与<TD>同样是标示一个储存格,唯一不同的是<TH>所标示的储存格中的文字是以粗体出现,通常用于表格第一列以标示栏目。它的用法是取代<TD>的位置便可以,其参数设定请参考<TD>。
当然若为<TD>所标示的储存格中的文字加上粗体标记<B>便等如<TH>的效果。西安协同教育示例<center>
<tablewidth="350"border="1"cellspacing="0"cellpadding="2"align="CENTER">
<tralign="CENTER"><th>Month</th><th>%ofIEvisitor</th><th>%ofNCvisitor</th>
</tr>
<tralign="CENTER"><td>August</td><td>61%</td><td>39%</td>
</tr>
<tralign="CENTER"><td>July</td><td>54%</td><td>46%</td>
</tr>
<tralign="CENTER"><td>June</td><td>52%</td><td>48%</td>
</tr>
</table>
</center>西安协同教育<CAPTION><CAPTION>的作用是为表格标示一个标题列,有如在表格上方加上一没格线的打通列。当然亦可置于下方,通常用以存放该表格的标题。<CAPTION>的参数设定(常用):
例如:<captionalign="TOP"valign="TOP"></caption>align="TOP"
该表格标题列相对于表格的摆放贴位置(水平),可选值为:left,center,right,top,middle,bottom,若align="bottom"的话标题列便会出现对表格的下方,不管你的原始码中把<caption>放在<table>中的头部或尾部。valign="TOP"
该表格标题列相对于表格的摆放位置(上下),可选值为:top,bottom。和align="TOP"或align="BOTTOM"是一样的,虽然功能重复了,但如果你要标题列置于下方及向右或向左贴,那末两个参数便可一用了。当只一个参数时,请首选align,因为valign
是由HTML3.0才开始的参数。西安协同教育示例<center>
<tablewidth="350"border="1"cellspacing="0"cellpadding="2"align="CENTER">
<caption>网页速成八月份访客浏览器使用分析</caption>
<tralign="CENTER"><th>Month</th><th>%ofIEvisitor</th><th>%ofNCvisitor</th>
</tr>
<tralign="CENTER"><td>August</td><td>61%</td><td>39%</td>
</tr>
</table>
</center>西安协同教育表单标记表单的用处很多,于网上无处不见,当然是配合CGI使用为佳,所以馈下有意使用或学习CGI的话,表单设计见必需的,这一节介绍的标记不多,但其参数变化很多。一份表单的基本架构是:在<FORM>标记的包围下加上一种或以上的表单输入方式及一个或以上的按键表单用于与服务器进行远程交互西安协同教育表单标记<FORM><FORM>称为表单标记,用以宣告此为表单模式,属于一个容器标记,表示其它表单标记需要在它的包围中才有效,<INPUT>便是其中的一个,用以设定各种输入资料的方法。它是一个空标记。<FORM>的参数设定(常用):
例如:<formaction="/cgi-local/example.cgi"method="POST">西安协同教育表单action=“/cgi-local/example.cgi”
表单通常是与CGI配合使用的,参数action便是用以指明该CGI程式的位置,这样此表单所填的资料才能正确传给CGI作处理。若馈下没有CGI以进行测试,可设定此参数为ACTION=“mailto:your@”那样该表单所填的资料将会寄至此电邮地址(红色部分)。
action=“./register.asp”method=“POST”
传送资料给CGI的的方式,可选值为POST,GET。你只需记住POST容许传送大量资料,但GET则只接受低于1K的资料,所以你若看过别人的表单原始码的话,你会发现申请表单用的是POST而搜索用的是GET。西安协同教育<INPUT>由于其第一个参数type己有很多的选择,而不同的选择表示出不同的输入方式,且其它参数亦因此而异,故以下将独立介绍不同输入方式及其它参数设定。type="Text"
可选值为Text,Radio,Checkbox,Password,Submit/Reset,Image,File,Hidden,Button。西安协同教育Text输入<inputtype="Text"name="age"value="20"
温馨提示
- 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
- 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
- 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
- 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
- 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
- 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
- 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。
最新文档
- 三一工作制度
- 关务工作制度
- 协管工作制度
- 健育工作制度
- 书营销工作制度
- 养殖组工作制度
- 书剔旧工作制度
- 在联席工作制度
- 企业办工作制度
- 南昌局工作制度
- 2026安徽辉隆集团农资连锁有限责任公司招聘1人笔试备考试题及答案解析
- 2026广东惠州市自然资源局招聘编外人员4人笔试参考题库及答案解析
- 中小学教师绩效工资分配激励研究-基于 2024 年中小学教师绩效工资实施办法
- 2026南京六合科技创业投资发展有限公司招聘9人笔试备考试题及答案解析
- 推拿店岗位责任制度模板
- 2026年汕头市普通高考第一次模拟考试 英语+答案
- 2026年宝山区国有(集体)企业招聘笔试参考题库附带答案详解
- 成都合资公司管理手册模板
- 二类医疗器械零售经营备案质量管理制度
- 人教版2026春季新版八年级下册英语全册教案(单元整体教学设计)
- 党课讲稿:践“廉行”强“廉政”守“廉心”勇担新时代廉洁从政使命
评论
0/150
提交评论