Welcome 布拉格

BlogJava

首頁

聯系

聚合

管理

6 Posts :: 13 Stories :: 15 Comments :: 0 Trackbacks

公告

常用鏈接

留言簿(3)

隨筆分類(1)

文章分類(7)

HTML 文件結構(Document Structures)

<html>...</html>
<head>...</head>
<body>...</body>

<HTML>
<HEAD>
     <title>, <base>, <link>, <isindex>, <meta>
</HEAD>
<BODY>
    HTML 文件的正文寫在這里... ... 
</BODY>
</HTML>

語言字符集(Charsets)的信息

<meta http-equiv="Content-Type" content="text/html;charset=#">

#=: us-ascii, iso-8859-1, x-mac-roman, iso-8859-2, x-mac-ce,
iso-2022-jp, x-sjis, x-euc-jp,
euc-kr, iso-2022-kr,
gb2312, gb_2312-80,
x-euc-tw, x-cns11643-1, x-cns11643-2, big5

可在 HTML 文件中設置 MIME 字符集信息。
您在瀏覽主頁時，最好自己在瀏覽器的選項菜單內選擇相應的語言(language encoding)。
但是如果 HTML 文件里寫明了設置，瀏覽器就會自動設置語言選項。
尤其是主頁里用到了字符實體(entities)，則該主頁就應該寫明字符集信息。
否則，您在瀏覽該主頁時，若未正確設置語言選項，顯示將可能混亂。

背景色彩和文字色彩

<body bgcolor=# text=# link=# alink=# vlink=#>

bgcolor --- 背景色彩

text --- 非可鏈接文字的色彩

link --- 可鏈接文字的色彩

alink --- 正被點擊的可鏈接文字的色彩

vlink --- 已經點擊(訪問)過的可鏈接文字的色彩

#=rrggbb

色彩是用 16 進制的紅－綠－藍(red-green-blue, RGB) 值來表示。
16 進制的數碼有: 0,1,2,3,4,5,6,7,8,9,a,b,c,d,e,f.

背景圖象 <body background="image-URL">
Non Scrolling Background <body bgproperties=FIXED>

頁面空白(Margin)

頁面左邊的空白 <body leftmargin=#>
頁面上方的空白(天頭) <body topmargin=#> #=margin amount

鏈接(Link)

基本語法 <a href="URL"> ... </a>

這是一個 <a href="samp/link.html">鏈接的例子</a>。點一下帶下劃線的文字!

這是一個鏈接的例子。點一下帶下劃線的文字!

跳轉到頁面的另外一個地方
<a href="#name"> ... </a>
<a name="name"> ... </a>

<a href="#jump-test">跳轉到下一個"鏈接點"</a><P> <a name="jump-test">下一個鏈接點</a>

下一個鏈接點

跳轉到另一個頁面的某個地方
<a href="URL#name"> ... </a>
<a name="name"> ... </a>

跳轉到另一個頁面的<a href="samp/link.html#jump-test">某個地方</a>。

跳轉到另一個頁面的某個地方。

開一個新的(瀏覽器)窗口 (Target Window)

<a href="URL" target="Window_Name"> ... </a>

<a href="samp/window.html" target="window_name"> 開一個新窗口! </a>

開一個新窗口!

標尺線

<hr>

<hr>

<hr size=#>

<hr size=10>

<hr width=#>

<hr width=50> <hr width=50%>

<hr align=#> #=left, right

<hr width=50% align=left> <hr width=50% align=right>

<hr noshade>

<hr noshade>

<hr color=#>

========

基本語法

表單的基本語法

`<form action="url" method=*> ... ... <input type=submit> <input type=reset> </form>`

*=GET, POST

表單中提供給用戶的輸入形式

`<input type=* name=**>`

*=text, password, checkbox, radio, image, hidden, submit, reset

**=Symbolic Name for CGI script

文字輸入和密碼輸入

*=text, password

<input type=>
<input type= value=**>

<form action=/cgi-bin/post-query method=POST>
您的姓名: 
<input type=text name=姓名><br>
您的主頁的網址: 
<input type=text name=網址 value=http://><br>
密碼: 
<input type=password name=密碼><br>
<input type=submit value="發送"><input type=reset value="重設">
</form>

您的姓名:
您的主頁的網址:
密碼:

<input type=* size=**>
<input type=* maxlength=**>

<form action=/cgi-bin/post-query method=POST>
<input type=text name=a01 size=40><br>
<input type=text name=a02 maxlength=5><br>
<input type=submit><input type=reset>
</form>

復選框(Checkbox) 和單選框(RadioButton)

<input type=checkbox>
<input type=checkbox checked>
<input type=checkbox value=**>

<form action=/cgi-bin/post-query method=POST>
<input type=checkbox name=水果1>
        Banana<p>
<input type=checkbox name=水果2 checked>
        Apple<p>
<input type=checkbox name=水果3 value=橘子>
        Orange<p>
<input type=submit><input type=reset>
</form>

<input type=radio value=>
<input type=radio value= checked>

<form action=/cgi-bin/post-query method=POST>
<input type=radio name=水果>
        Banana<p>
<input type=radio name=水果 checked>
        Apple<p>
<input type=radio name=水果 value=橘子>
        Orange<p>
<input type=submit><input type=reset>
</form>

圖象坐標

在下面選則一個系數后，在圖象上點一下，就知道什么是圖象坐標了！

<input type=image src=url>

<form action=/cgi-bin/post-query method=POST>
<input type=image name=face src=f.gif><p>
<input type=radio name=zoom value=2 checked>x2
<input type=radio name=zoom value=4>x4
<input type=radio name=zoom value=6>x6<p>
<input type=reset>
</form>

隱藏表單的元素

<input type=hidden value=*>

<form action=/cgi-bin/post-query method=POST>
<input type=hidden name=add value=hoge@hoge.jp>
Here is a hidden element. <p>
<input type=submit><input type=reset>
</form>

列表框(Selectable Menu)

基本語法

<select name=*>
<option> ...
</select>

<option selected>
<option value=**>

<form action=/cgi-bin/post-query method=POST>
<select name=fruits>
        <option>Banana
        <option selected>Apple
        <option value=My_Favorite>Orange
</select><p>
<input type=submit><input type=reset>
</form>

<select size=**>

<form action=/cgi-bin/post-query method=POST>
<select name=fruits size=3>
        <option>Banana
        <option selected>Apple
        <option value=My_Favorite>Orange
        <option>Peach
</select><p>
<input type=submit><input type=reset>
</form>

<select size=** multiple>

注意，是用 Ctrl 鍵配合鼠標實現多選。
(和 MS-WINDOWS 的 File Manager 一樣)

<form action=/cgi-bin/post-query method=POST>
<select name=fruits size=3 multiple>
        <option selected>Banana
        <option selected>Apple
        <option value=My_Favorite>Orange
        <option selected>Peach
</select><p>
<input type=submit><input type=reset>
</form>

文本區域

<textarea name=* rows= cols=> ... <textarea>

<form action=/cgi-bin/post-query method=POST>
<textarea name=comment rows=5 cols=60>
</textarea>
<P>
<input type=submit><input type=reset>
</form>

對于很長的行是否進行換行的設置(Word Wrapping)

<textarea wrap=off> ... </textarea>

不換行，是缺省設置。

<textarea wrap=soft> ... </textarea>

“軟換行”，好象 MS－WORD 里的“軟回車”。

<form action=/cgi-bin/post-query method=POST> <textarea wrap=soft name=comment rows=5 cols=25> </textarea><P> <input type=submit><input type=reset> </form>

<textarea wrap=hard> ... </textarea>

“硬換行”，好象 MS－WORD 里的“硬回車”。

<form action=/cgi-bin/post-query method=POST> <textarea wrap=hard name=comment rows=5 cols=25> </textarea><P> <input type=submit><input type=reset> </form>

posted on 2007-09-13 15:40 Welcome 閱讀(1956) 評論(0) 編輯收藏所屬分類: HTML\CSS

新用戶注冊刷新評論列表


只有注冊用戶登錄后才能發表評論。




網站導航: 博客園 IT新聞 Chat2DB C++博客博問管理
相關文章: CSS基本布局16例表單Form實例和講解緩存的知識 html cache HTML/css常識 html滾動代碼大全---Marquee

Welcome 布拉格

公告

常用鏈接

留言簿(3)

隨筆分類(1)

文章分類(7)

最新評論

HTML 文件結構(Document Structures)

<html>...</html><head>...</head><body>...</body>

語言字符集(Charsets)的信息

<meta http-equiv="Content-Type" content="text/html;charset=#">

背景色彩和文字色彩

<body bgcolor=# text=# link=# alink=# vlink=#>

#=rrggbb

背景圖象 <body background="image-URL">Non Scrolling Background <body bgproperties=FIXED>

頁面空白(Margin)

頁面左邊的空白 <body leftmargin=#>頁面上方的空白(天頭) <body topmargin=#> #=margin amount

鏈接(Link)

基本語法 <a href="URL"> ... </a>

跳轉到頁面的另外一個地方<a href="#name"> ... </a><a name="name"> ... </a>

跳轉到另一個頁面的某個地方<a href="URL#name"> ... </a><a name="name"> ... </a>

開一個新的(瀏覽器)窗口 (Target Window)

<a href="URL" target="Window_Name"> ... </a>

標尺線

<hr>

<hr size=#>

<hr width=#>

<hr align=#> #=left, right

<hr noshade>

<hr color=#>

========

基本語法

表單的基本語法

<form action="url" method=*>... ... <input type=submit> <input type=reset></form>

表單中提供給用戶的輸入形式

<input type=* name=**>

文字輸入和密碼輸入

<input type=*><input type=* value=**>

<input type=* size=**><input type=* maxlength=**>

復選框(Checkbox) 和 單選框(RadioButton)

<input type=checkbox><input type=checkbox checked><input type=checkbox value=**>

<input type=radio value=**><input type=radio value=** checked>

圖象坐標

<input type=image src=url>

隱藏表單的元素

<input type=hidden value=*>

列表框(Selectable Menu)

基本語法

<select name=*><option> ...</select>

<option selected><option value=**>

<select size=**>

<select size=** multiple>

文本區域

<textarea name=* rows=** cols=**> ... <textarea>

對于很長的行是否進行換行的設置(Word Wrapping)

<textarea wrap=off> ... </textarea>

<textarea wrap=soft> ... </textarea>

<textarea wrap=hard> ... </textarea>

<html>...</html>
<head>...</head>
<body>...</body>

背景圖象 <body background="image-URL">
Non Scrolling Background <body bgproperties=FIXED>

頁面左邊的空白 <body leftmargin=#>
頁面上方的空白(天頭) <body topmargin=#> #=margin amount

跳轉到頁面的另外一個地方
<a href="#name"> ... </a>
<a name="name"> ... </a>

跳轉到另一個頁面的某個地方
<a href="URL#name"> ... </a>
<a name="name"> ... </a>

`<form action="url" method=*> ... ... <input type=submit> <input type=reset> </form>`

`<input type=* name=**>`

<input type=>
<input type= value=**>

<input type=* size=**>
<input type=* maxlength=**>

復選框(Checkbox) 和單選框(RadioButton)

<input type=checkbox>
<input type=checkbox checked>
<input type=checkbox value=**>

<input type=radio value=>
<input type=radio value= checked>

<select name=*>
<option> ...
</select>

<option selected>
<option value=**>

<textarea name=* rows= cols=> ... <textarea>