《Web數(shù)據(jù)庫(kù)技術(shù)應(yīng)用教程（第二版）》課件第4章_第1頁(yè)
《Web數(shù)據(jù)庫(kù)技術(shù)應(yīng)用教程（第二版）》課件第4章_第2頁(yè)
《Web數(shù)據(jù)庫(kù)技術(shù)應(yīng)用教程（第二版）》課件第4章_第3頁(yè)
《Web數(shù)據(jù)庫(kù)技術(shù)應(yīng)用教程（第二版）》課件第4章_第4頁(yè)
《Web數(shù)據(jù)庫(kù)技術(shù)應(yīng)用教程（第二版）》課件第4章_第5頁(yè)
已閱讀5頁(yè)，還剩56頁(yè)未讀， 繼續(xù)免費(fèi)閱讀

下載本文檔

版權(quán)說(shuō)明：本文檔由用戶提供并上傳，收益歸屬內(nèi)容提供方，若內(nèi)容存在侵權(quán)，請(qǐng)進(jìn)行舉報(bào)或認(rèn)領(lǐng)

文檔簡(jiǎn)介

本章主要內(nèi)容HTML語(yǔ)言的特點(diǎn)。HTML語(yǔ)言的語(yǔ)言環(huán)境。HTML語(yǔ)言的編寫規(guī)范。常用的HTML語(yǔ)言標(biāo)記。4.1文檔結(jié)構(gòu)HTML的英文全稱是HypertextMarkedLanguage，中文叫做“超文本標(biāo)記語(yǔ)言”。HTML文件由元素（element）組成，絕大多數(shù)元素是容器，即它有起始標(biāo)記和結(jié)尾標(biāo)記。元素的起始標(biāo)記叫做起始鏈接簽（starttag），元素結(jié)束標(biāo)記叫做結(jié)尾鏈接簽（endtag），在起始鏈接簽和結(jié)尾鏈接簽中間的部分是元素體。每一個(gè)元素都有名稱和可供選擇的屬性，元素的名稱和屬性都在起始鏈接簽內(nèi)標(biāo)明。比如體元素（body）：<bodybackground=back-ground.gif><h2>demo</h2>Thisismyfirsthtmlfile.<p></body>4.1文檔結(jié)構(gòu)（序）文件應(yīng)具有下面的結(jié)構(gòu)：<html>

HTML文件開始<head>文件頭開始文件頭</head>文件頭結(jié)束<body>文件體開始文件體</body>文件體結(jié)束</html>HTML文件結(jié)束4.1文檔結(jié)構(gòu)（序）一般來(lái)講，HTML的元素有下列三種表示方法：（1）<元素名>文件或超文本</元素名>（2）<元素名屬性名=屬性值…>文本或超文本</元素名>（3）<元素名>4.1文檔結(jié)構(gòu)（序）（1）題目（title）。title元素是文件頭中唯一一個(gè)必須出現(xiàn)的元素，它也只能出現(xiàn)在文件頭中。title元素的格式為：<title>文件題目</title>例子：<title>AsampleofHTML5.0</title> 4.1文檔結(jié)構(gòu)（序）（2）標(biāo)題（hn）標(biāo)題元素有6種，分為h1、h2、…、h6，表示文章中的各種題目。標(biāo)題號(hào)越小，字體越大。一般情況下，瀏覽器對(duì)標(biāo)題作如下解釋：h1：黑體，特大字體，居中，上下各有兩行空行。h2：黑體，大字體，上下各有一到兩行空行。h3：黑體（斜體），大字體，左端微縮進(jìn)，上下空行。h4：黑體，普通字體，比h3更多縮進(jìn)，上邊空一行。h5：黑體（斜體），與h4相同縮進(jìn)，上邊空一行。h6：黑體，與正文有相同縮進(jìn)，上邊空一行。hn可以有對(duì)齊屬性，align=#。#表示：left：標(biāo)題居左，center：標(biāo)題居中，right：標(biāo)題居右。例：<h2align=center>Chapter2</h2>表示標(biāo)題Chapter2用h2黑體，大字體，上下各有一到兩行空行顯示。4.2頁(yè)面文本修飾4.2.1字體和字號(hào)普通文本的字體。字體風(fēng)格分為物理風(fēng)格和邏輯風(fēng)格。物理風(fēng)格直接指定字體，物理風(fēng)格的字體有<b>黑體，<i>斜體，<u>下劃線，<tt>打字機(jī)體。<s>字符上加橫線，物理風(fēng)格的例子及其輸出如下：<b>IlikeHTML!</b><p><i>IlikeHTML!</i><p><u>IlikeHTML!</u><p><tt>IlikeHTML!</tt><p><s>IlikeHTML!</s><p>輸出結(jié)果如下：4.2頁(yè)面文本修飾（序）邏輯風(fēng)格指定文本的作用，<em>強(qiáng)調(diào)<strong>特別強(qiáng)調(diào)<code>源代碼<samp>例子<kbd>鍵盤輸入<var>變量<dfn>定義<cite>引用<small>較小<big>較大<sup>上標(biāo)<sub>下標(biāo)。4.2頁(yè)面文本修飾（序）邏輯風(fēng)格的例子如下：<em>今天天氣真好！</em><p><strong>今天天氣真好！</strong><p><code>今天天氣真好！</code><p><samp>今天天氣真好！</samp><p><kbd>今天天氣真好！</kbd><p><var>今天天氣真好！</var><p><dfn>今天天氣真好！</dfn><p><cite>今天天氣真好！</cite><p><small>今天天氣真好！<sub>下標(biāo)</sub></small><p><big>今天天氣真好！<sup>上標(biāo)</sup></big><p>4.2頁(yè)面文本修飾（序）HTML還有7種字號(hào)供選擇，1號(hào)最小，7號(hào)最大。HTML還提供了字體顏色的設(shè)定方法。字體的顏色用<fontcolor=#>指定，#可以是6位十六進(jìn)制數(shù)，分別指定紅、綠、藍(lán)的值，也可以是black、olive、teal、red、blue、maroon、navy、gray、lime、white、green、purple、sliver、yellow、aqua之一。4.2.2顯示控制1．預(yù)排版文本<pre>：不需要重新排版的內(nèi)容，可以用<pre>…</pre>通知瀏覽器。瀏覽器在輸出時(shí)對(duì)這部分內(nèi)容幾乎不做修改。2．塊引用<blockquote>：塊引用表示其中的內(nèi)容是引用。3．居中<center>：居中鏈接簽4．分段<p>：HTML的分段完全依賴于分段元素<p>。4.2.3文本滾動(dòng)基本語(yǔ)法如下：<marquee>文本</marquee>1．文字移動(dòng)方向的設(shè)置：<direction=#>#=left、right設(shè)置文字移動(dòng)的方向。2．文字移動(dòng)屬性的設(shè)置語(yǔ)法格式如下：<bihavior=#>#=scroll,slide,alternate文字移動(dòng)屬性

bihavior=scroll設(shè)定文字一圈一圈繞著移動(dòng)；bihavior=slide設(shè)定文字只移動(dòng)一次就停止；bihavior=alternate設(shè)定文字來(lái)回移動(dòng)。4.2.3文本滾動(dòng)（序）3．移動(dòng)的次數(shù)的設(shè)置格式如下：循環(huán)<loop=#>#=次數(shù)。若未指定次數(shù)，則循環(huán)不止（infinite）。4．文字移動(dòng)速度的設(shè)置格式如下：<scrollamount=#>5．文字延時(shí)的設(shè)置語(yǔ)法格式如下：<scrolldelay=#>6．文字外觀（Layout）的設(shè)置語(yǔ)法如下：<align=#>#=top,middle,bottom分別表示對(duì)齊窗口的上沿、中間、下沿。4.2.3文本滾動(dòng)（序）7．文字底色的設(shè)置語(yǔ)法格式：<bgcolor=#>其中#=rrggbb可以用十六進(jìn)制數(shù)碼表示紅、綠、藍(lán)顏色，也可以是下列預(yù)定義色彩Black、Olive、Teal、Red、Blue、Maroon、Navy、Gray、Lime、Fuchsia、White、Green、Purple、Silver、Yellow、Aqua。8．文字移動(dòng)背景面積的設(shè)置語(yǔ)法格式如下：<height=#width=#>#可以表示像素，也可以表示窗口的百分比。9．空白文字（Margins）的設(shè)置語(yǔ)法格式：<hspace=#vspace=#>#可以表示像素。4.2.4其他文本修飾1．閃爍<blink>語(yǔ)法格式：<blink>文本</blink>該設(shè)置文本閃爍，閃爍頻率為１秒鐘一次。2．分行<br><br>表示在此處分行。<brclear=#>clear屬性標(biāo)明下一行的情況，如clear=left，表示下一行從左邊界處開始。#可以是left、right、all之一。3．背景和文本顏色窗口背景可以用下列方法指定：<bodybackground=image-url><bodybgcolor=#text=#link=#alink=#vlink=#>前者指定填充背景的圖像，如果圖像的大小小于窗口大小，則把背景圖像重復(fù)，直到填滿窗口區(qū)域。后者指定的是十六進(jìn)制的紅、綠、藍(lán)分量。bgcolor背景顏色；text文本顏色；link鏈接指針顏色；alink活動(dòng)的鏈接指針顏色；vlink已訪問(wèn)過(guò)的鏈接指針顏色。4.2.4其他文本修飾（序）4．轉(zhuǎn)義字符與特殊字符html中<、>、&有特殊含義（前兩個(gè)字符用于鏈接簽，&用于轉(zhuǎn)義），不能直接使用。使用這三個(gè)字符時(shí)，應(yīng)使用它們的轉(zhuǎn)義序列。&的轉(zhuǎn)義序列為&s;或&。<的轉(zhuǎn)義序列為≪或<。>的轉(zhuǎn)義序列為>或>。需要說(shuō)明的是：轉(zhuǎn)義序列各字符間不能有空格。轉(zhuǎn)義序列必須以“；”結(jié)束。單獨(dú)的“&”不被認(rèn)為是轉(zhuǎn)義開始。4.2.4其他文本修飾（序）5．區(qū)隔標(biāo)記<DIV>作用：設(shè)定字、畫、表格等的擺放位置。以<DIValign="center">為例：align="center"可選值center、left、right決定字、畫、表格等居中、靠左或靠右。6．不折行標(biāo)記<NOBR>作用：令某些文字不因太長(zhǎng)而繞行，顯示于同一行或下一行。它對(duì)住址、數(shù)學(xué)算式、一行數(shù)字、程序代碼等尤為有用。4.3圖像和多媒體1．圖像HTML支持內(nèi)嵌式的圖像顯示，一幅圖在HTML文檔中就如同一個(gè)單詞，與其他單詞一起在一個(gè)段落中如流水般地依次排列。鏈入圖像的基本語(yǔ)法：<imgsrc=#alt=##>

其中#為圖像的URL##為在瀏覽器尚未完全讀入圖像時(shí)在圖像位置顯示的文字。屬性SRC表示圖的源（Source）文件，URL信息必須對(duì)應(yīng)一個(gè)圖像文件。

4.3圖像和多媒體（序）2．圖像在頁(yè)面中的對(duì)齊/布局（FloatingImage）（1）圖像顯法在窗口的左邊或右邊。語(yǔ)法格式：<imgalign=#>#=left或right。（2）圖像嵌入左上角。語(yǔ)法格式：<brclear=all>（3）圖像與文字之間留有空間。語(yǔ)法格式：<imgvspace=#hspace=#>，#表示像素值。（4）圖像加上邊框。語(yǔ)法格式：<imgborder=#>，#表示邊框的像素值。（5）在默認(rèn)狀況下，圖片顯示原有的大小。可以用height和width屬性改變圖片的大小。語(yǔ)法格式：<imgsrc=URLwidth=#height=#>，#表示像素值。4.3圖像和多媒體（序）4．聲音和視頻Web瀏覽器通過(guò)其他輔助工具的幫助來(lái)播放聲音和視頻文件。播放文件，就必須把文件作為一個(gè)超鏈中的URL信息。當(dāng)觸發(fā)這一超鏈接時(shí)，Web瀏覽器在輔助工具表中啟動(dòng)相應(yīng)的程序來(lái)播放它們。請(qǐng)看下例：<H2>Hereisthe<AHREF=demo.wav>audiodemo</A>.</H2><H2>Hereisthe<AHREF=demo.avi>videodemo</A>.</H2>4.4列表常用的清單有三種格式無(wú)序清單（unorderedlist）有序清單（orderedlist）定義清單（definitionlist）。4.4列表（序）1．無(wú)序清單（ul）：用<ul>開始，每一個(gè)清單條目用<li>引導(dǎo)，最后是</ul>。2．有序清單<ol>：在輸出時(shí)清單條目用數(shù)字標(biāo)示。3．定義清單<dl>：定義清單用于對(duì)清單條目進(jìn)行簡(jiǎn)短說(shuō)明的場(chǎng)合，用<dl>開始，清單條目用<dt>引導(dǎo)，說(shuō)明用<dd>引導(dǎo)。4.4列表（序）4．改變條目標(biāo)記（1）改變無(wú)序清單條目標(biāo)記。無(wú)序清單輸出時(shí)，每一條目前都有一個(gè)黑色圓點(diǎn)，用type屬性修改條目的標(biāo)記。type可以的取值如下：disc：實(shí)心圓點(diǎn)。circle：圓圈。square：實(shí)心方點(diǎn)。（2）改變有序清單條目標(biāo)記。有序清單條目標(biāo)記的默認(rèn)值是阿拉伯?dāng)?shù)字，可以用type屬性修改。方法為<Litype=#>，#含義如下：A：大寫字母。a：小寫字母。I：大寫羅馬數(shù)字。i：小寫羅馬數(shù)字。l：缺省，阿拉伯?dāng)?shù)字。（3）改變有序清單條目的起始數(shù)字。有序清單的條目數(shù)字在默認(rèn)情況下是從1開始的，用start屬性可以修改該值。方法為<olstart=#>，#是條目起始號(hào)。4.4列表（序）5．清單的嵌套：各種清單可以相互嵌套，每一個(gè)清單條目都可以是一個(gè)單獨(dú)的清單。每嵌套一層，清單條目的輸出就會(huì)有更大的縮進(jìn)。4.5超級(jí)鏈接一個(gè)超文本鏈接指針由兩部分組成。一是被指向的目標(biāo)，它可以是同一文件的另一部分，也可以是世界另一端的一個(gè)文件，還可以是動(dòng)畫或音樂(lè)；另一部分是指向目標(biāo)的鏈接指針。1．統(tǒng)一資源定位器URL在Internet上，各個(gè)網(wǎng)絡(luò)、各臺(tái)主機(jī)的操作系統(tǒng)都不一樣，因此必須指定訪問(wèn)該文件的方法。一個(gè)URL包括了以上所有的信息，它的構(gòu)成為：protocol://[:port]/directory/filename其中，protocol是訪問(wèn)該資源所采用的協(xié)議，即訪問(wèn)該資源的方法，它可以是以下幾種協(xié)議：http：超文本傳輸協(xié)議，該資源是HTML文件。file：文件傳輸協(xié)議，用ftp訪問(wèn)該資源。ftp：文件傳輸協(xié)議，用ftp訪問(wèn)該資源。gopher：gopher協(xié)議，該資源是gopher文件。news：表明該資源是網(wǎng)絡(luò)新聞。4.5超級(jí)鏈接（序）2．指向一個(gè)目標(biāo)<a>鏈接指針指向一個(gè)目標(biāo)。基本格式為：<ahref=url>字符串</a>href屬性中的統(tǒng)一資源定位器（URL）是被指向的目標(biāo)，隨后的字符串在HTML文件中充當(dāng)指針的角色，一般顯示為藍(lán)色。圖像作為鏈接指針的格式為：<ahref=url><imgsrc=url></a>3．標(biāo)記一個(gè)目標(biāo)對(duì)于同一文件的不同部分，標(biāo)識(shí)目標(biāo)。標(biāo)識(shí)一個(gè)目標(biāo)的方法為：<aname=name>text</a>4．目標(biāo)窗口被指向的目標(biāo)在一個(gè)新的窗口中顯示，可以使用target屬性修飾鏈接指針元素。<ahref=urltarget=window-name>text</a>4.6表格標(biāo)記1．表格的基本形式一個(gè)表由<table>開始，</table>結(jié)束，表的內(nèi)容由<tr>、<th>和<td>定義。<tr>說(shuō)明表的一個(gè)行，表有多少行就有多少個(gè)<tr>；<th>說(shuō)明表的列數(shù)和相應(yīng)欄目的名稱，下面是一個(gè)有表格線和一個(gè)元組的表格線的表及其輸出。<title>thesimplesthtmlfile</title><tableborder><tr><th>食物</th><th>飲料</th><th>甜點(diǎn)</th><tr><td>面包</td><td>可樂(lè)</td><td>布丁</td></table>輸出如下：4.6表格標(biāo)記（序）2．有通欄的表有橫向通欄的表用<thcolspan=#>屬性說(shuō)明。colspan表示橫向欄距，#代表通欄占據(jù)的網(wǎng)格數(shù)，它是一個(gè)小于表的橫向網(wǎng)格數(shù)的整數(shù)。下面是一個(gè)有表格線和有橫向通欄的表及其輸出。<title>thesimplesthtmlfile</title><tableborder><tr><thcolspan=2>食物</th><th>飲料</th><th>甜點(diǎn)</th><tr><td>面包</td><td>牛奶</td><td>可樂(lè)</td><td>布丁</td></table>輸出如下：4.6表格標(biāo)記（序）3．表的大小、邊框?qū)挾取⒈砀耖g距表的大小用width=#和height=#屬性說(shuō)明。前者為表寬，后者為表高，#是以像素為單位的整數(shù)。下面是一個(gè)有表格線和表格尺寸設(shè)置的表及其輸出。<title>thesimplesthtmlfile</title><tableborderwidth=270height=200><tr><th>食物</th><th>飲料</th><th>甜點(diǎn)</th><tr><td>面包</td><td>可樂(lè)</td><td>布丁</td></table>輸出如下：4.6表格標(biāo)記（序）4．表中文本的輸出文本與表框的距離用cellpadding=#說(shuō)明。下面的例子使表的內(nèi)容與表框離開10個(gè)像素。<title>thesimplesthtmlfile</title><tablebordercellpadding=10><tr><th>食物</th><th>飲料</th><th>甜點(diǎn)</th><tr><td>面包</td><td>可樂(lè)</td><td>布丁</td></table>輸出如下：4.6表格標(biāo)記（序）5．浮動(dòng)表格指表格與文件中內(nèi)容對(duì)齊時(shí)，若在現(xiàn)在位置上不能滿足其對(duì)齊方式，表格上下移動(dòng)，即擠開一些內(nèi)容，直到滿足其對(duì)齊要求。浮動(dòng)屬性一般由align=left或right指定。下面的例子可以看出，cllign=left時(shí)把字符串?dāng)D到了表的右邊。當(dāng)右邊空間不夠時(shí)，該字符串會(huì)顯示在表的下邊，看起來(lái)像是表格浮到了字符串上。<title>thesimplesthtmlfile</title><tablealign=leftborder><tr><th>食物</th><th>飲料</th><th>甜點(diǎn)</th><tr><td>面包</td><td>可樂(lè)</td><td>布丁</td></table>Myfavorites...<br>milk,bread,apple,rice,soup,chicken,meat,beaf,bear,candy,banana,orange,pear,pearapple,ice-cream,egg,sala,cookies,chocolates,andmore.輸出如下：4.6表格標(biāo)記（序）6．表格顏色表格的顏色用bgcolor=#指定。#是十六進(jìn)制的6位數(shù)，格式為rrggbb，分別表示紅、綠、藍(lán)三色的分量。7．表格標(biāo)題表格可以加上標(biāo)題。標(biāo)題的語(yǔ)法格式如下：<captionalign=#>...</caption>#=left,center,right4.7窗口框架1．分框的基本格式分框的基本結(jié)構(gòu)如下：<html><head><title>...</title></head><noframes>...</noframes><frameset><framesrc=url></frameset></html>分框由<frameset>指定，并且可以嵌套，分區(qū)中各部分顯示的內(nèi)容用<frame>指定。需要說(shuō)明的是，frame是一個(gè)新出現(xiàn)的元素，許多瀏覽器不支持它。4.7窗口框架（序）2．橫向分框橫向分框用<framesetcols=#>指定，#可以是一個(gè)百分?jǐn)?shù)，也可以是一個(gè)整數(shù)。前者規(guī)定各框占窗口的分?jǐn)?shù)，后者指定各框的絕對(duì)大小。例如，下面的例子將窗口分成30%、20%、50%的幾個(gè)區(qū)域，各區(qū)域的內(nèi)容分別為A.html、B.html、C.html。例子如下：<title>HTML語(yǔ)言教程</title><framesetrows=25%,25%,50%><framesrc=A.html><framesrc=B.html><framesrc=C.html></frameset>輸出如下：4.7窗口框架（序）3．縱向分框縱向分框用<framesetcols=#>指定，#含義同上。4．混合分框?qū)⒋翱诜殖煽v橫幾個(gè)區(qū)域時(shí)，用<frameset>代替<frame>鏈接，即可將原來(lái)分好的<frame>區(qū)域再次分框，下面的例子先將窗口分成20%、80%，然后將右邊的區(qū)域再分成分別占40%和60%的上下兩個(gè)區(qū)域。例子如下：<title>HTML語(yǔ)言教程</title><framesetcols=20%,*><framesrc=A.html><framesetrows=40%,*><framesrc=B.html><framesrc=C.html></frameset></frameset>輸出如下：4.7窗口框架（序）5．分框與框中文本的間距分框與其中的文本間距可以用marginwidth=#和margiheight=#來(lái)指定，前者指定文本與分框的邊緣的橫向距離，后者指定縱向距離，其單位都為像素，下面的例子中將右邊分框的左右邊距、上下空白都設(shè)為50個(gè)像素。例子如下：<title>HTML語(yǔ)言教程</title><framesetcols=50%,50%><framesrc=A.html><framesrc=A.htmlmarginwidth=50marginheight=50></frameset>輸出如下：4.7窗口框架（序）6．分框間的關(guān)聯(lián)分框之間可以有特定的關(guān)聯(lián)，比如將某一框的內(nèi)容輸出到另一個(gè)框，這樣該段文字可以把其中一個(gè)框作為輸出框，另一個(gè)框作為選擇框。實(shí)現(xiàn)這種關(guān)聯(lián)需要做下列的事情。（1）在分框的HTML文件中標(biāo)記各個(gè)框，標(biāo)記的方法是在<frame>中加入name屬性，定義左邊的框?yàn)檩敵觯疫叺目驗(yàn)樗饕?lt;framesrc=A.htmlname=display><framesrc=B.htmlname=index>（2）在B.html文件中指定輸出到哪個(gè)框中去的方法是在B.html文件中加入如下一行：<basetarget=display>用鼠標(biāo)單擊B.html中的鏈接指針，它的輸出會(huì)顯示在左邊的框中。4.8表單一個(gè)表單有以下三個(gè)基本組成部分：表單標(biāo)簽：其中包含處理表單數(shù)據(jù)所用CGI程序的URL以及數(shù)據(jù)提交到服務(wù)器的方法。表單域：包含文本框、密碼框、隱藏域、多行文本框、復(fù)選框、單選按鈕、下拉選擇框和文件上傳框等。表單按鈕：包括提交按鈕、復(fù)位按鈕和一般按鈕，用于將數(shù)據(jù)傳送到服務(wù)器上的CGI腳本或者取消輸入，還可以用表單按鈕來(lái)控制其他定義了處理腳本的處理工作。4.8.1表單標(biāo)簽格式：<form></form>功能：用于聲明表單，定義采集數(shù)據(jù)的范圍，也就是<form>和</form>中包含的數(shù)據(jù)將被提交到服務(wù)器或者電子郵件里。語(yǔ)法：<FORMACTION=URLMETHOD=GET|POSTENCTYPE=MIMETARGET=...>...</FORM>屬性解釋如下：action=url：指定用來(lái)處理表單提交的數(shù)據(jù)的應(yīng)用程序。它可以是任何一個(gè)有效的URL，那么用戶在表單中輸入的信息就會(huì)傳入那個(gè)URL處。method=get或post：控制收集信息的傳送方式。post方法可以通過(guò)action所指定的服務(wù)程序?qū)Ρ韱芜M(jìn)行處理；get方法可以將表單的內(nèi)容作為查詢URL中的串來(lái)傳送，服務(wù)器使用QueryString集合來(lái)存儲(chǔ)這些內(nèi)容。enctype：指定如何對(duì)數(shù)據(jù)編碼，只有在使用post方式時(shí)這個(gè)屬性才適用，而且有唯一的可能值，即默認(rèn)值application/x-www-form-urlencoded。該屬性在平時(shí)的表單創(chuàng)建中可以不使用。4.8.1表單標(biāo)簽（序）TARGET=#，#的值如下：_blank：在一個(gè)新的、無(wú)名瀏覽器窗口調(diào)入指定的文檔。_self：在指向這個(gè)目標(biāo)元素的相同的框架中調(diào)入文檔。_parent：把文檔調(diào)入當(dāng)前框的直接的父Frameset框中；這個(gè)值在當(dāng)前框沒有父框時(shí)等價(jià)于_self。_top：把文檔調(diào)入原來(lái)的最頂部的瀏覽器窗口中（因此取消所有其他框架）；這個(gè)值等價(jià)于當(dāng)前框沒有子框時(shí)的_self。4.8.2表單域表單域文本框多行文本框密碼框隱藏域復(fù)選框單選按鈕和下拉選擇框等4.8.2表單域（序）1．文本框文本框是一種讓訪問(wèn)者自己輸入內(nèi)容的表單對(duì)象，通常用來(lái)填寫單個(gè)字或者簡(jiǎn)短的回答，如姓名、地址等。代碼格式：<inputtype=textname=...size=...maxlength=...value=...>屬性解釋：type=text：定義單行文本輸入框。name：定義文本框的名稱，要保證數(shù)據(jù)的準(zhǔn)確采集，要定義一個(gè)獨(dú)一無(wú)二的名稱。size：定義文本框的寬度，單位是單個(gè)字符寬度。maxlength：定義最多輸入的字符數(shù)。value：定義文本框的初始值。4.8.2表單域（序）2．多行文本框多行文本框也是一種讓訪問(wèn)者自己輸入內(nèi)容的表單對(duì)象，讓訪問(wèn)者填寫較長(zhǎng)的內(nèi)容。代碼格式：<TEXTAREAname=...cols=...rows=...wrap=VIRTUAL></TEXTAREA>屬性解釋如下：name：同文本框。cols：定義多行文本框的寬度，單位是單個(gè)字符寬度。rows：定義多行文本框的高度，單位是單個(gè)字符寬度。wrap：定義輸入內(nèi)容大于文本域時(shí)顯示的方式，可選值如下：Off：用來(lái)避免文本換行，當(dāng)輸入的內(nèi)容超過(guò)文本域右邊界時(shí)，文本將向左滾動(dòng)，必須用Return才能將插入點(diǎn)移到下一行。Virtual：允許文本自動(dòng)換行。當(dāng)輸入內(nèi)容超過(guò)文本域的右邊界時(shí)會(huì)自動(dòng)轉(zhuǎn)到下一行，而數(shù)據(jù)在被提交處理時(shí)自動(dòng)換行的地方不會(huì)有換行符出現(xiàn)。Physical：讓文本換行，當(dāng)數(shù)據(jù)被提交處理時(shí)換行符也將被一起提交處理。4.8.2表單域（序）3．密碼框是一種特殊的文本域，用于輸入密碼。當(dāng)訪問(wèn)者輸入文字時(shí)，文字會(huì)被星號(hào)或其他符號(hào)代替，而輸入的文字會(huì)被隱藏。代碼格式：<inputtype=passwordname=...size=...maxlength=...>.屬性解釋：type=password：定義密碼框。name：同文本框。size：定義密碼框的寬度，單位是單個(gè)字符寬度。maxlength：定義最多輸入的字符數(shù)。4.8.2表單域（序）4．隱藏域隱藏域是用來(lái)收集或發(fā)送信息的不可見元素，對(duì)于網(wǎng)頁(yè)的訪問(wèn)者來(lái)說(shuō)，隱藏域是看不見的。當(dāng)表單被提交時(shí)，隱藏域就會(huì)將信息用設(shè)置時(shí)定義的名稱和值發(fā)送到服務(wù)器上。代碼格式：<inputtype=hiddenname=...value=...>屬性解釋：type=hidden定義隱藏域；name同文本框；value屬性定義隱藏域的值。5．復(fù)選框復(fù)選框允許在待選項(xiàng)中選中一項(xiàng)以上的選項(xiàng)。每個(gè)復(fù)選框都是一個(gè)獨(dú)立的元素，都必須有一個(gè)唯一的名稱。代碼格式：<INPUTtype=checkboxname=...value=...>屬性解釋：type=checkbox：定義復(fù)選框。name：同文本框。value：定義復(fù)選框的值。4.8.2表單域（序）6．文件上傳框用戶上傳自己的文件，文件上傳框看上去和其他文本域差不多，只是它還包含一個(gè)瀏覽按鈕。訪問(wèn)者可以通過(guò)輸入需要上傳的文件的路徑或者單擊瀏覽按鈕選擇需要上傳的文件。在使用文件域以前，請(qǐng)先確定服務(wù)器是否允許匿名上傳文件。表單標(biāo)簽中必須設(shè)置ENCTYPE=multipart/form-data來(lái)確保文件被正確編碼，另外，表單的傳送方式必須設(shè)置成POST。代碼格式：<inputtype=filename=...size=15maxlength=100>屬性解釋：type=file：定義文件上傳框。name：同文本框。size：定義文件上傳框的寬度，單位是單個(gè)字符寬度。maxlength：定義最多輸入的字符數(shù)。4.8.2表單域（序）7．下拉選擇框下拉選擇框允許在一個(gè)有限的空間設(shè)置多種選項(xiàng)。代碼格式：<selectname=...size=...multiple><optionvalue=...selected>...</option>...</select>屬性解釋：size：定義下拉選擇框的行數(shù)。name：定義下拉選擇框的名稱。multiple：表示可以多選，如果不設(shè)置本屬性，那么只能單選。value：定義選擇項(xiàng)的值。selected：表示默認(rèn)已經(jīng)選擇本選項(xiàng)。4.8.3表單按鈕1．提交按鈕提交按鈕用來(lái)將輸入的信息提交到服務(wù)器。代碼格式：<inputtype=submitname=...value=...>屬性解釋：submit：定義提交按鈕。name：定義提交按鈕的名稱。value：定義按鈕的顯示文字。圖片提交的方式，代碼語(yǔ)法格式如下：<inputtype=imagesrc=images/icons/go.gifalt=提交NAME=imgsubmit>inputtype=image相當(dāng)于inputtype=submit，不同的是，inputtype=image以一個(gè)圖片作為表單的提交按鈕，其中src屬性表示圖片的路徑。4.8.3表單按鈕（序）2．復(fù)位按鈕復(fù)位按鈕用來(lái)重置表單。代碼格式：<inputtype=resetname=...value=...>屬性解釋：type=reset：定義復(fù)位按鈕。復(fù)位及提交按鈕的例子如下：<html><formaction=/cgi-bin/post-querymethod=POST><inputtype=resetname=myCanclevalue=取消><inputtype=submitname=mySentvalue=發(fā)送></form></html>輸出如下：4.8.3表單按鈕（序）3．一般按鈕一般按鈕用來(lái)控制其他定義了處理腳本的處理工作。代碼格式：<inputtype=buttonname=...value=...onClick=...>屬性解釋：type=button：定義一般按鈕。onClick：可以是其他的事件，通過(guò)指定腳本函數(shù)來(lái)定義按鈕的行為。4.9其他網(wǎng)頁(yè)修飾1．注釋標(biāo)識(shí)注釋標(biāo)識(shí)是一種比較常用的在HTML中添加注釋的方法。注釋的標(biāo)識(shí)符是：<!--…-->…號(hào)處可以寫上注釋文字。這些文字將不會(huì)出現(xiàn)在網(wǎng)頁(yè)上，僅僅用于HTML文檔的注釋，從而使閱讀文檔的人易于理解編寫文檔人的思路。注釋標(biāo)記應(yīng)該落在<body>與</body>之間，而不是<head>與</head>之間。4.9其他網(wǎng)頁(yè)修飾（序）2．橫線<hr>橫線一般用于分隔同一文本的不同部分。在窗口中劃一條橫線非常簡(jiǎn)單，只要寫一個(gè)<hr>即可。橫線的寬度用<hrsize=n>指定，<width=#>指n是線寬，單位是像素。例如，<hrsize=10>。<hr>指定橫線長(zhǎng)度，可以指定絕對(duì)線長(zhǎng)，也可以指定橫線長(zhǎng)度占窗口寬度的百分比。例如<hrwidth=50>、<hrwidth=50%>。橫線的位置用<hralign=#>指定。#是left或right，left表示左端與左邊界對(duì)齊，right是右端與右邊界對(duì)齊，缺省時(shí)橫線出現(xiàn)在窗口正中。4.10樣式表（CSS）技術(shù)4.10.1級(jí)聯(lián)樣式表的基本規(guī)則樣式表實(shí)際上是由一些具體的樣式屬性組成的，如顏色屬性、位置屬性或者文本屬性等，并由這些樣式屬性來(lái)精確、詳細(xì)地格式化文檔的顯示。樣式表可以根據(jù)具體的要求添加相關(guān)的樣式屬性來(lái)描述指定的樣式，所以這就使得樣式表的應(yīng)用極其靈活、多樣。在實(shí)踐的基礎(chǔ)上可以創(chuàng)建各種經(jīng)典的樣式表應(yīng)用于各種HTML文檔中描述元素，同時(shí)這樣做還可以使不同的頁(yè)面達(dá)到比較一致的顯示效果。樣式表都是由<STYLE>標(biāo)記及其屬性來(lái)實(shí)現(xiàn)的，使用標(biāo)記或者屬性可以指定任意的樣式屬性來(lái)組成樣式表。級(jí)聯(lián)樣式表主要分為內(nèi)部級(jí)聯(lián)和外部級(jí)聯(lián)。內(nèi)部級(jí)聯(lián)是指在HTML文檔代碼中直接使用樣式標(biāo)記或者樣式屬性來(lái)描述元素的樣式外部級(jí)聯(lián)指通過(guò)引用HTML文檔以外建立的樣式表來(lái)描述文檔元素。4.10樣式表（CSS）技術(shù)（序）級(jí)聯(lián)式樣式表的語(yǔ)法格式一般為：<STYLETYPE=text/css>樣式標(biāo)記名1{{樣式規(guī)則1}......樣式標(biāo)記名n{樣式規(guī)則n}</STYLE>或者：<標(biāo)記STYLE=樣式規(guī)則>4.10樣式表（CSS）技術(shù)（序）樣式規(guī)則的格式為：{屬性名1:屬性值1;屬性名2:屬性值2;……屬性名n:屬性值n}屬性名和屬性值之間使用冒號(hào)，不同的屬性之間使用分號(hào)，最后一個(gè)屬性值后可以不加分號(hào)，所有的屬性都用{}包含起來(lái)。例如：<STYLETYPE=TEXT/CSS>P{FONT-SIZE:24;FONT-WEIGHT:BOLD;MARGIN-LEFT:50px;COLOR:RED}H1{COLOR:YELLOW;FONT-SIZE:36;BACKGROUND:OLIVE;WORD-SPACING:21PT;}</STYLE><!--結(jié)束樣式表定義--><P>該段文字愛編程</P><!--應(yīng)用P樣式--><H1>該段文字愛編程</H1><!--應(yīng)用H1樣式-->4.10樣式表（CSS）技術(shù)

溫馨提示

  • 1. 本站所有資源如無(wú)特殊說(shuō)明，都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請(qǐng)下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等，如果需要附件，請(qǐng)聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙，網(wǎng)頁(yè)內(nèi)容里面會(huì)有圖紙預(yù)覽，若沒有圖紙預(yù)覽就沒有圖紙。
  • 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
  • 5. 人人文庫(kù)網(wǎng)僅提供信息存儲(chǔ)空間，僅對(duì)用戶上傳內(nèi)容的表現(xiàn)方式做保護(hù)處理，對(duì)用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯，并不能對(duì)任何下載內(nèi)容負(fù)責(zé)。
  • 6. 下載文件中如有侵權(quán)或不適當(dāng)內(nèi)容，請(qǐng)與我們聯(lián)系，我們立即糾正。
  • 7. 本站不保證下載資源的準(zhǔn)確性、安全性和完整性, 同時(shí)也不承擔(dān)用戶因使用這些下載資源對(duì)自己和他人造成任何形式的傷害或損失。

最新文檔

評(píng)論

0/150

提交評(píng)論