查看: 229|回复: 1

HTML知识入门

[复制链接]

大天使路西法

电梯直达

1^#

发表于 2009-9-15 02:31:58 | 只看该作者回帖奖励

|倒序浏览 |阅读模式

前几天在论坛上看到一个入门的帖子可惜不全，我最近也正好在研究这个，就把一些在网上找到的东西和各位分享一下~~先传一部分，太长了估计各位也看不下去~~

表单(FORM)标记(TAGS)

基本语法
表单的基本语法
<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>

Banana

Apple

Orange

<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>

Banana

Apple

Orange

隐藏表单的元素
<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>

Here is a hidden element.

列表框(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>

BananaAppleOrange

<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>

BananaAppleOrangePeach

<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>

BananaAppleOrangePeach

文本区域
<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>

收藏0