HTML & JavaScript
q 有三種類型的鏈接路徑:
q 絕對(duì)路徑(例如 http://www.sohu.com/index.html)
q 文檔相對(duì)路徑(例如 adver/contents.html)
q 站點(diǎn)根目錄相對(duì)路徑(例如 /support/app/customer.html,其中“/”表示根目錄)
常用的事件有:
onClick
onMouseDown
onMouseOut
onMouseOver
onReset
onSelect
onSubmit
onload
常用的動(dòng)作有:
彈出信息
打開瀏覽器窗口
轉(zhuǎn)到 URL
驗(yàn)證表單
META 標(biāo)簽是一個(gè)特殊的 HTML 標(biāo)簽,提供有關(guān)網(wǎng)頁的信息,如作者姓名、公司名稱和聯(lián)系信息等
http-equiv 屬性可用來代替 META 標(biāo)簽中的 name 屬性
<P>…</P> 標(biāo)簽用于標(biāo)記段落
q 只要在文本中放入 <BR> 標(biāo)簽,就會(huì)強(qiáng)制換行
<PRE> 標(biāo)簽用于顯示具有預(yù)先定義格式的文本
<BODY>
<H1>星期中的每一天</H1>
<UL>
<LI>星期日
<LI>星期一
<LI>星期二
<LI>星期三
<LI>星期四
<LI>星期五
<LI>星期六
</UL>
</BODY>
無序列表也稱為“項(xiàng)目列表”
<BODY>
<H1>星期中的每一天</H1>
<OL>
<LI>星期日
<LI>星期一
<LI>星期二
<LI>星期三
<LI>星期四
<LI>星期五
<LI>星期六
</OL>
</BODY>
有序列表的屬性
|
<LI TYPE = I>
|
<LI TYPE = i>
|
<LI TYPE = A>
|
<LI TYPE = a>
|
<OL START = n>
|
在有序列表中,列表項(xiàng)以自動(dòng)生成的順序顯示
特殊字符
|
字符實(shí)體
|
大于號(hào) (>)
|
>
|
小于號(hào) (<)
|
<
|
引號(hào) (“)
|
"
|
®
|
®
|
©
|
©
|
& 號(hào)
|
&
|
q 錨記標(biāo)簽用于使用戶“跳”到文檔的某個(gè)部分
q HTML 的 NAME 屬性用于創(chuàng)建錨標(biāo)記
<A NAME = “marker”>主題名稱</A>
q 為達(dá)到這種跳轉(zhuǎn)效果,請(qǐng)?jiān)?/span> HREF 參數(shù)中使用該標(biāo)記
<A HREF= “#marker”>主題名稱</A>
Conclude
q HTML 標(biāo)簽一般配對(duì)使用,不區(qū)分大小寫
q 標(biāo)簽都具有屬性。屬性提供關(guān)于網(wǎng)頁上 HTML 元素的附加信息
q META 標(biāo)簽放置在網(wǎng)頁的標(biāo)題處以提供關(guān)于頁面的信息。搜索引擎常會(huì)用到這些標(biāo)簽
q 標(biāo)題級(jí)標(biāo)簽使用<H1>…<H6>
q 段落標(biāo)簽使用<P align=“對(duì)齊方式”>…</P>
q 無序列表使用<UL>標(biāo)簽,有序列表使用<OL>標(biāo)簽
q 字體標(biāo)簽<Font color=“顏色” size=“大小” face=“字體”>
q 超鏈接標(biāo)簽<A href=“鏈接地址”>超鏈接文本</A>
Chapter 5
<CAPTION>表示表格標(biāo)題
<TH>表示行或列標(biāo)題,粗體顯示
COLSPAN=“n” 屬性表示跨多少列
ROWSPAN=“n” 屬性表示跨多少行
<html>
<head>
<title>課堂練習(xí)1</title>
</head>
<body>
<table border=3 width=50%>
<caption align=top>課堂測(cè)試</caption>
<tr>
<td align=center>1</td><td align=center>2</td><td align=center>3</td>
</tr>
<tr>
<td align=center>4</td><td align=center>5</td><td rowspan=2 align=center>6</td>
</tr>
<tr>
<td colspan=2 align=center>7</td>
</tr>
</table>
</body>
</html>
<FORM action=“http://www.sohu.com” method=“post”>
action指定提交后由服務(wù)器上哪個(gè)處理程序處理
文本框、按鈕、單選按鈕、復(fù)選框等都是輸入元素。
<INPUT type=“?” name=“?” size=”?”
value=“?” maxlength=“?” checked=“?”>
Type
|
此屬性指定元素的類型。元素類型可以有多種選擇:TEXT、PASSWORD、CHECKBOX、RADIO、SUBMIT、RESET、FILE、HIDDEN 和 BUTTON。默認(rèn)選擇為 TEXT。
|
Name
|
此屬性指定控件的名稱。例如,如果表單中有幾個(gè)文本框,則可以用名稱 TEXT1、TEXT2 或選擇的任何名稱來標(biāo)識(shí)它們。Name 屬性的作用域是在 FORM 元素內(nèi)。
|
Value
|
此屬性是可選屬性,它指定控件的初始值。但是,如果 TYPE 為 RADIO,則必須指定一個(gè)值。
|
Size
|
此屬性指定控件的初始寬度。如果 TYPE 為 TEXT 或 PASSWORD,則控件的大小以字符為單位。對(duì)于其他輸入類型,寬度以像素為單位。
|
Maxlength
|
此屬性用于指定可在 TEXT 或 PASSWORD 元素中輸入的最大字符數(shù)。
|
Checked
|
此屬性是 Boolean 屬性,指定按鈕是否是打開的。當(dāng)輸入類型為 RADIO 或 CHECKBOX 時(shí),使用此屬性。
|
<INPUT name="button1" type="submit" value="提交">
<INPUT name="button2" type="reset" value="重置">
<INPUT name="button3" type="button" value="普通按鈕">
*
身份證號(hào)<input type="Text" name="PID" value=""
size="20" maxlength="18">
密 碼: <INPUT type=password value=“” name=“pass" size=15>
<TEXTAREA name=“textarea” clos="20" rows="5" >請(qǐng)?zhí)顚懩墓ぷ鹘?jīng)歷</TEXTAREA>
*
性別:<INPUT TYPE=radio NAME=”sex” VALUE=”male”>男性
<INPUT TYPE=radio NAME=”sex” VALUE=”male”>女性
你喜歡以下哪些明星:
<br>
<input type="Checkbox" name="id1" value="Noriko_Sagai">酒井法子
<input type="Checkbox" name="id2" value="Leon">鄭秀文
<input type="Checkbox" name="id3" value="BonJovi"
checked>BonJovi
*
<B>誰是 2002 年世界杯冠軍?</B>
<SELECT NAME =“myselect">
<OPTION SELECTED>西班牙</OPTION>
<OPTION>法國</OPTION>
<OPTION>巴西</OPTION>
<OPTION>德國</OPTION>
</SELECT>
*
<HTML>
<HEAD>
<TITLE>求職者</TITLE>
<META http-equiv="Content-Type" content="text/html; charset=gb2312"> </HEAD>
<BODY bgcolor="#FFBFFF">
<P align="center"><FONT size="5">申請(qǐng)表</FONT>
<HR color="#FF9F00" >
<FORM ACTION="http://somesite.com/processform" METHOD="POST">
姓名:
<INPUT TYPE="TEXT" ID="firstname">
<P>感興趣的職位:
<P>
<INPUT TYPE=RADIO NAME="CONTROL1" VALUE="0" CHECKED>Web 設(shè)計(jì)人員
<INPUT TYPE=RADIO NAME="CONTROL1" VALUE="1" >Web 管理員
<INPUT TYPE=RADIO NAME="CONTROL1" VALUE="2" >Web 開發(fā)人員
<P>其他要求<BR>
<TEXTAREA NAME="CONTROL3" COLS="30" ROWS="5">包括薪水待遇、工作地點(diǎn)等。
</TEXTAREA>
<P><INPUT NAME="CONTROL4" TYPE=CHECKBOX CHECKED>發(fā)送確認(rèn)信息
<BR>
經(jīng)驗(yàn)
<SELECT NAME="CONTROL2">
<OPTION>無經(jīng)驗(yàn)</OPTION>
<OPTION>1 年</OPTION>
<OPTION>3 年</OPTION>
<OPTION>5 年</OPTION>
</SELECT>
<P>
<INPUT name="提交" TYPE=submit VALUE=" 確 定 ">
<INPUT name="重置" TYPE=reset VALUE=" 重 置 ">
</FORM>
</BODY>
</HTML>
Conclude2
<TABLE width=“?” border=“?” align=“?”>
<CAPTION> 表格標(biāo)題</ CAPTION >
<TR bgcolor=“?”>
<TH align=“?”>數(shù)據(jù)1 <TH>
<TH align=“?”>數(shù)據(jù)2 <TH>
…..
</TR>
<TR bgcolor=“?” >
<TD align=“?”>數(shù)據(jù)11 </TD>
<TD align=“?”>數(shù)據(jù)22</TD>
</TR>
</TABLE>
*
<FORM action=“?” method=“?” >
文本框 <INPUT type=“text” name=“?” value=“?”
maxlength=“?">
密碼框 <INPUT type=“password” name=“?” value=“” >
文本域 <textarea name=“?” clos=“?” rows=“?”>
</textarea >
單選按鈕<INPUT TYPE=radio NAME=”?” VALUE=”?”>
男性
復(fù)選框<input type="Checkbox" name="?" value="?">
酒井法子
*
<SELECT NAME ="?">
<OPTION >選項(xiàng)1</OPTION>
<OPTION>選項(xiàng)2</OPTION>
<OPTION>...</OPTION>
</SELECT>
<INPUT type="Submit" value="提交" name="?">
<INPUT type="reset" value="重置" name="?">
</ FORM>