網頁代碼

網頁代碼

所謂的網頁代碼,就是指在網頁製作過程中需要用到的一些特殊的“語言”,設計人員通過對這些“語言”進行組織編排製作出網頁,然後由瀏覽器對代碼進行“翻譯”後才是我們最終看到的效果。 製作網頁時常用的代碼有HTML,JavaScript,ASP,PHP,CGI等,其中超文本標記語言(標準通用標記語言下的一個套用、外語簡稱:HTML)是最基礎的網頁代碼。

基本信息

標記語言

下面主要講述的就是HTML代碼的一些簡單使用:

跑馬燈效果

<marquee>...</marquee>普通捲動

<marquee behavior=slide>...</marquee>滑動

<marquee behavior=scroll>...</marquee>預設捲動

<marquee behavior=alternate>...</marquee>來回捲動

<marquee direction=down>...</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 scrollamount=30>...</marquee>設定捲動距離

<marqueescrolldelay=300>...</marquee>設定捲動時間

註:在HTML5中 廢棄了只有部分瀏覽器支持的marquee標籤其它還包括applet、bgsound、blink、等標籤。

字型效果

<h1>...</h1>標題字(最大 )

<h6>...</h6>標題字(最小)

<b>...</b>粗體字

<strong>...</strong>粗體字(強調)

<i>...</i>斜體字

<em>...</em>斜體字(強調)

<dfn>...</dfn>斜體字(表示定義)

<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:100 px">...</font>無限增大

<FONT FACE> 任意指定所用的字形

<BASEFONT SIZE> 更改預設字形大小

<BIG> 顯示大字型

<BLINK> 閃爍的文字

<BR> 換行

區斷標記

<hr>水平線

<hr size="9">水平線(設定大小)

<hr width="80%">水平線(設定寬度)

<hr color="ff0000">水平線(設定顏色)

<br>(換行)

<nobr>...</nobr>水域(不換行)

<p>...</p>水域(段落)

<center>...</center>置中

連結格式

<base href=地址>(預設好連結路徑)

<a href=地址></a>外部連結

<a href=地址></a>外部連結(另開新視窗)

<a href=地址 target="_top"></a>外部連結(全視窗連結)

<a href=地址 target="頁框名"></a>外部連結(在指定頁框連結)

<A HREF TARGET> 指定超級連結的分割視窗

<A HREF=#錨的名稱> 指定錨名稱的超級連結

<A HREF> 指定超級連結

<A NAME=錨的名稱> 被連結點的名稱

<ADDRESS>....</ADDRESS> 用來顯示電子信箱地址

貼圖與音樂

<img src=圖片地址>貼圖

<img src=圖片地址 width="180">設定圖片寬度

<img src=圖片地址 height="30">設定圖片高度

<img src=圖片地址 alt="提示文字">設定圖片提示文字

<img src=圖片地址' border="1">設定圖片框線

<bgsound src=MID音樂檔案地址>背景音樂設定

表格語法

<table align=left>...</table>表格位置,置左

<table align=center>...</table>表格位置,置中

<table background=圖片路徑>...</table>背景圖片的URL=就是路徑網址

<table border=框線大小>...</table>設定表格框線大小(使用數字)

<table bgcolor=顏色碼>...</table>設定表格的背景顏色

<table borderclor=顏色碼>...</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>指定儲存格合併列的列數(使用數字)

<CAPTION>...</CAPTION> 為表格加上標題

<TABLE BORDER=n> 調整表格的寬線高度

<TABLE CELLPADDING> 調整數據域位之邊界

<TABLE CELLSPACING> 調整表格線的寬度

<TABLE HEIGHT> 調整表格的高度

<TABLE WIDTH> 調整表格的寬度

<TABLE>...</TABLE> 產生表格的卷標

<TD ALIGN> 調整表格欄位之左右對齊

<TD BGCOLOR> 設定表格欄位之背景顏色

<TD COLSPAN ROWSPAN> 表格欄位的合併

<TD NOWRAP> 設定表格欄位不換行

<TD VALIGN> 調整表格欄位之上下對齊

<TD WIDTH> 調整表格欄位寬度

<TD>...</TD> 定義表格的數據域位

分割視窗

<frameset cols=\"20%,*\">左右分割,將左框線架分割大小為20%右框線架的大小瀏覽器會自動調整

<frameset rows=\"20%,*\">上下分割,將上面框架分割大小為20%下面框架的大小瀏覽器會自動調整

<frameset cols=\"20%,*\">分割左右兩個框架

<frameset cols=\"20%,*,20%\">分割左中右三個框架

<frameset rows=\"20%,*,20%\">分割上中下三個框架

<FRAME MARGINHEIGHT> 設定視窗的上下邊界

<FRAME MARGINWIDTH> 設定視窗的左右邊界

<FRAME NAME> 為分割視窗命名

<FRAME NORESIZE> 鎖住分割視窗的大小

<FRAME SCROLLING> 設定分割視窗的滾動條

<FRAME SRC> 將HTML檔案加入視窗

<FRAMESET COLS> 將視窗分割成左右的子視窗

<FRAMESET ROWS> 將視窗分割成上下的子視窗

<FRAMESET>...</FRAMESET> 劃分分割視窗

<CAPTION ALIGN> 設定表格標題位置

<CENTER> 向中對齊

<CITE>...<CITE> 用於引經據典的文字

<CODE>...</CODE> 用於列出一段程式代碼

<COMMENT>...</COMMENT> 加上批註

<DD> 設定定義列表的項目解說

<DFN>...</DFN> 顯示\"定義\"文字

<DIR>...</DIR> 列表文字卷標

<DL>...</DL> 設定定義列表的卷標

<DT> 設定定義列表的項目

<EM> 強調之用

結構性定義

檔案類型<HTML></HTML> (放在檔案的開頭與結尾)

檔案主題<TITLE></TITLE> (必須放在「文頭」區塊內)

文頭<HEAD></HEAD> (描述性資料,像是「主題」)

文體<BODY></BODY> (檔案本體)

(由瀏覽器控制的顯示風格)

標題<H?></H?> (從1到6,有六層選擇)

標題的對齊<H? ALIGN=LEFT|CENTER|RIGHT></H?>

區分<DIV></DIV>

區分的對齊<DIV ALIGN=LEFT|RIGHT|CENTER|JUSTIFY></DIV>

引文區塊<BLOCKQUOTE></BLOCKQUOTE> (通常會內縮)

強調<EM></EM> (通常會以斜體顯示)

特彆強調<STRONG></STRONG> (通常會以加粗顯示)

引文<CITE></CITE> (通常會以斜體顯示)

碼<CODE></CODE> (顯示原始碼之用)

樣本<SAMP></SAMP>

鍵盤輸入<KBD></KBD>

變數<VAR></VAR>

定義<DFN></DFN> (有些瀏覽器不提供)

地址<ADDRESS></ADDRESS>

大字<BIG></BIG>

小字<SMALL></SMALL>

與外觀相關的標籤(作者自訂的表現方式)

加粗<B></B>

斜體<I></I>

底線<U></U> (尚有些瀏覽器不提供)

刪除線<S></S> (尚有些瀏覽器不提供)

下標<SUB></SUB>

上標<SUP></SUP>

打字機體<TT></TT> (用單空格字型顯示)

預定格式<PRE></PRE> (保留檔案中空格的大小)

預定格式的寬度<PRE WIDTH=?></PRE>(以字元計算)

向中看齊<CENTER></CENTER> (文字與圖片都可以)

閃耀<BLINK></BLINK> (有史以來最被嘲弄的標籤)

字型大小<FONT SIZE=?></FONT>(從1到7)

改變字型大小<FONT SIZE=+|-?></FONT>

基本字型大小<BASEFONT SIZE=?> (從1到7; 內定為3)

字型顏色<FONT COLOR="#$$$$$$"></FONT>

連結與圖形

連結<A href="/URL"></A>

連結到錨點<A HREF="URL#***"></A>(如果錨點在另一個檔案)

<A HREF="#***"></A> (如果錨點現有檔案)

連結到目的視框<A href="/URL" TARGET="***"></A>

設定錨點<A></A>

圖形<IMG src="/URL">

圖形看齊方式<IMG src="/URL" ALIGN=TOP|BOTTOM|MIDDLE>

圖形看齊方式<IMG src="/URL"

ALIGN=LEFT|RIGHT|TEXTTOP|ABSMIDDLE|BASELINE|ABSBOTTOM>

取代文字<IMG src="/URL" ALT="***"> (如果沒有辦法顯示圖形則顯示此文字)

點選圖<IMG src="/URL" ISMAP> (需要CGI程式)

N2.0 點選圖<IMG src="/URL" USEMAP="URL">

N2.0 地圖<MAP></MAP>(描述地圖)

N2.0 段落<AREA SHAPE="RECT" COORDS=",,," href="/URL"|NOHREF>

3.0 大小<IMG src="/URL" WIDTH="?" HEIGHT="?">(以pixels為單位)N1.0 圖形邊緣<IMG src="/URL" BORDER=?> (以pixels為單位)

N1.0 圖形邊緣空間<IMG src="/URL" HSPACE=? VSPACE=?> (以pixels為單位)

N1.0 低解析度圖形<IMG src="/URL" LOWsrc="/URL">

N1.1 用戶端拉<META HTTP-EQUIV="Refresh" CONTENT="?; URL=URL">(使用端自動更新)

N2.0 內嵌物件<EMBED src="/URL"> (將物件插入頁面)

N2.0 內嵌物件大小<EMBED src="/URL" WIDTH="?" HEIGHT="?">

分隔

段落<P> (通常是兩個return)

3.0 段落<P></P> (新定義成容器型標籤)

3.0 文字看齊方式<P ALIGN=LEFT|CENTER|RIGHT></P>

換行<BR> (一個return)

N1.0 文字部份看齊方式<BR CLEAR=LEFT|RIGHT|ALL>(與圖形合用時)

橫線<HR>

N1.0 橫線對齊<HR ALIGN=LEFT|RIGHT|CENTER>

N1.0 橫線厚度<HR SIZE=?> (以pixels為單位)

N1.0 橫線寬度<HR WIDTH=?> (以pixels為單位)

N1.0 橫線比率寬度<HR WIDTH=%> (以頁寬為100%)

N1.0 實線<HR NOSHADE> (沒有立體效果)

N1.0 不可換行<NOBR></NOBR> (不換行)

N1.0 可換行處<WBR> (如果需要,可在此斷行)

列舉(可以巢狀列舉)

無次序式列舉<UL><LI></UL> (<LI> 放在每一項前)

N1.0 公布式列舉<UL TYPE=DISC|CIRCLE|SQUARE>(定義全部的列舉項)

<LI TYPE=DISC|CIRCLE|SQUARE>(定義這個及其後的列舉項)

有次序式列舉<OL><LI></OL> (<LI> 放在每一項前)

N1.0 數標型態<OL TYPE=A|a|I|i|1> (定義全部的列舉項)

<LI TYPE=A|a|I|i|1> (定義這個及其後的列舉項)

N1.0 起始數字<OL value=?> (定義全部的列舉項)

<LI value=?> (定義這個及其後的列舉項)

定義式列舉<DL><DT><DD></DL>(<DT>項目, <DD>定義)

表單式列舉<MENU><LI></MENU>(<LI> 放在每一項前)

目錄式列舉<DIR><LI></DIR> (<LI> 放在每一項前)

背景與顏色

3.0 重複排列的背景<BODY >

N1.1+ 背景顏色<BODY BGCOLOR="#$$$$$$"> (依序為紅、綠、藍)

N1.1+ 文字顏色<BODY TEXT="#$$$$$$">

N1.1+ 連結顏色<BODY LINK="#$$$$$$">

N1.1+ 看過的連結<BODY VLINK="#$$$$$$">

N1.1 使用中的連結<BODY ALINK="#$$$$$$">

特殊字元(以下標籤需用小寫)

1.

特殊字元(以下標籤需用小寫)

特別符號&#?; (其中? 代表ISO 8859-1 的編碼)

< < > > & & ' '

註冊商標TM ?

N1.0+ 註冊商標TM ?

著作權符號?

N1.0+ 著作權符號?

表單(通常需要與CGI程式配合)

1.

表單(通常需要與CGI程式配合)

定義表單<FORM ACTION="URL" METHOD=GET|POST></FORM>

N2.0 上傳檔案<FORM ENCTYPE="multipart/form-data></FORM>

輸入欄位<INPUT TYPE="TEXT|PASSWORD|CHECKBOX|RADIO|IMAGE|HIDDEN|SUBMIT|RESET'>

欄位名稱<INPUT>

欄位內定值<INPUT value="***">

已選定<INPUT CHECKED> (適用於checkboxes與radio boxes)

欄位寬度<INPUT SIZE=?> (以字元數為單位)

最長字數<INPUT MAXLENGTH=?> (以字元數為單位)

下拉式選單<SELECT></SELECT>

下拉式選單名稱<SELECT></SELECT>

選單項目數量<SELECT SIZE=?></SELECT>

多選式選單<SELECT MULTIPLE> (多選)

選項<OPTION>

內定選項<OPTION SELECTED>

文字輸入區<TEXTAREA ROWS=? COLS=?></TEXTAREA>

輸入區名稱<TEXTAREA></TEXTAREA>

N2.0 輸入區換行方式<TEXTAREA WRAP=OFF|VIRTUAL|PHYSICAL></TEXTAREA>

表格

3.0 定義表格<TABLE></TABLE>

3.0 表格框線<TABLE BORDER></TABLE> (有或沒有)

N1.1 表格框線<TABLE BORDER=?></TABLE>(可以設定數值)

N1.1 儲存格左右留白<TABLE CELLSPACING=?>

N1.1 儲存格上下留白<TABLE CELLPADDING=?>

N1.1 表格寬度<TABLE WIDTH=?> (以pixels為單位)

N1.1 寬度比率<TABLE WIDTH=%> (頁寬為100%)

3.0 表格列<TR></TR>

3.0表格列內容看齊<TR ALIGN=LEFT|RIGHT|CENTER VALIGN=TOP|MIDDLE|BOTTOM>

3.0 儲存格<TD></TD> (須與列並用)

3.0 儲存格內容看齊<TD ALIGN=LEFT|RIGHT|CENTER VALIGN=TOP|MIDDLE|BOTTOM>

3.0 不換行<TD NOWRAP>

N3.0 儲存格背景顏色<TD BGCOLOR=#$$$$$$>

3.0 儲存格橫向連線<TD COLSPAN=?>

3.0 儲存格縱向連線<TD ROWSPAN=?>

N1.1 儲存格寬度<TD WIDTH=?> (以pixels為單位)

N1.1 儲存格寬度比率<TD WIDTH=%> (頁寬為100%)

3.0 表格標題<TH></TH> (跟<TD>一樣,不過會對中並加粗)

3.0 表格標題對齊<TH ALIGN=LEFT|RIGHT|CENTER VALIGN=TOP|MIDDLE|BOTTOM>

3.0 表格標題不換行<TH NOWRAP>

3.0 表格標題占幾欄<TH COLSPAN=?>

3.0 表格標題占幾列<TH ROWSPAN=?>

N1.1 表格標題寬度<TH WIDTH=?> (以pixels為單位)

N1.1 表格標題比率寬度<TH WIDTH=%> (頁寬為100%)

3.0 表格抬頭<CAPTION></CAPTION>

3.0表格抬頭看齊<CAPTION ALIGN=TOP|BOTTOM>(在表格之上/之下)

視框(定義與控制螢幕上的特定區域)

N2.0 視框格式總定義<FRAMESET></FRAMESET> (取代<BODY>)

N2.0 視框行長度分配<FRAMESET ROWS=,,,></FRAMESET>(pixels 或%)

N2.0 視框行長度分配<FRAMESET ROWS=*></FRAMESET> (* = 相對大小)

N2.0 視框欄寬度分配<FRAMESET COLS=,,,></FRAMESET>(pixels 或%)

N2.0 視框欄寬度分配<FRAMESET COLS=*></FRAMESET> (* =相對大小)

N2.0 定義個別視框<FRAME> (定義個別視框)

N2.0 個別視框內容<FRAME src="/URL">

N2.0 個別視框名稱<FRAME|_blank|_self|_parent|_top>

N2.0 邊緣寬度<FRAME MARGINWIDTH=?> (「左」與「右」邊界)

N2.0 邊緣高度<FRAME MARGINHEIGHT=?> (「天頂」與「地底」邊界)

N2.0 捲動條<FRAME SCROLLING="YES|NO|AUTO">

N2.0 不可改變大小<FRAME NORESIZE>

N2.0 無視框時的內容<NOFRAMES></NOFRAMES>(如果瀏覽器不提供視框功能的話)

相關資料

所謂代碼最佳化是指對程式代碼進行等價(指不改變程式的運行結果)變換。程式代碼可以是中間代碼(如四元式代碼),也可以是目標代碼。等價的含義是使得變換後的代碼運行結果與變換前代碼運行結果相同。最佳化的含義是最終生成的目標代碼短(運行時間更短、占用空間更小),時空效率最佳化。原則上,最佳化可以再編譯的各個階段進行,但最主要的一類是對中間代碼進行最佳化,這類最佳化不依賴於具體的計算機。

編譯過程中可進行的最佳化可按階段劃分:最佳化可在編譯的不同階段進行,分為中間代碼一級和目標代碼一級的最佳化。可按最佳化涉及的程式範圍劃分:對同一階段,分為局部最佳化,循環最佳化和全局最佳化. 進行最佳化所需要的基礎是對代碼進行數據流分析和控制流分析。如劃分DAG,查找循環,分析變數的定值點和引用點等等。最常用的代碼最佳化技術有刪除多餘運算,循環不變代碼外提,強度削弱,變換循環控制條件,合併已知量與複寫傳播,以及刪除無用賦值等等。

相關詞條

相關搜尋

熱門詞條

聯絡我們