預備知識html網(wǎng)頁設計基礎_第1頁
預備知識html網(wǎng)頁設計基礎_第2頁
預備知識html網(wǎng)頁設計基礎_第3頁
預備知識html網(wǎng)頁設計基礎_第4頁
預備知識html網(wǎng)頁設計基礎_第5頁
已閱讀5頁，還剩28頁未讀， 繼續(xù)免費閱讀

下載本文檔

版權說明：本文檔由用戶提供并上傳，收益歸屬內容提供方，若內容存在侵權，請進行舉報或認領

文檔簡介

HTML網(wǎng)頁設計基礎

1認識和使用HTML

2HTML常用標記

3HTML表單標記

4用FrontPage設計HTML

1認識和使用HTML

1.1什么是HTMLHTML使用各種不同的標記符號來分別標識和設定不同的網(wǎng)頁元素。每一個網(wǎng)頁元素通常由開始標記、結束標記，以及夾在這兩個標記中的內容所組成。一個HTML元素的形式可表示為：<標記名稱屬性名稱=值……>內容</標記名稱>說明：也可以在<html>之間使用<frameset>標記；不區(qū)分大小寫；連續(xù)的空格、Tab鍵只當成一個空格；可以使用<!－－內容－－>注釋；Html文檔中的錯誤會跳過不予理會；各元素可以嵌套不可以交錯。需要區(qū)分大小寫嗎？整個Html文件可以在一行中書寫嗎？一個標識可以在多行中書寫嗎？屬性之間有次序要求嗎？1.2HTML文檔基本架構<html><head><title>網(wǎng)頁標題</title></head><body><p>這是正文部分！</p></body></html>1.3創(chuàng)建一個簡單的HTML文檔圖創(chuàng)建一個簡單HTML文檔圖執(zhí)行結果2HTML常用標記

2.1段落標記1．標題標記格式：<Hnalign=對齊方式>標題文字</Hn>說明：<Hn>標記符用于定義段落標題的大小級數(shù)。最大是<h?>，最小<h?>。align屬性可控制文字的對齊方式，值可以是left，center，或者right。h1h62.1段落類標記2．分段標記格式：<Palign=對齊方式>文字</P>說明：<P>標記符用于劃分段落。<P>是成對標記符，用于定義內容從新的一行開始，并與上段之間有一個空行。3．換行標記格式：文字<BR>說明：<br>標記符用于定義從新的一行顯示，它不產(chǎn)生一個空行，但連續(xù)多個<br>標記可以產(chǎn)生多個空行的效果。<br>標記符是非成對標記符。4．橫線標記格式：<HRsize=粗細align=對齊方式width=寬度color=顏色>說明：hr標記為非成對標記。2.2文字格式標記1．字體標記格式：<FONTsize=大小face=字體名稱color=顏色>文字</FONT>2．空格用“ ”表示。（1）face屬性：定義字體，如face=“隸書”。（2）size屬性：定義大小，屬性值為1~7，也可以使用相對大小來設置，如size=“+5”、size=“-5”。（3）color屬性。定義顏色，可用英文來表示，如：color=“red”；也可使用16進制的RGB來表示，color=“#FF0000”。此外，字體標記符還包括<b>…</b>粗體標記符、<i>…</i>斜體標記符等。2.3列表標記1．無序列表標記格式：<ULtype=項目符號類型>

<litype=項目符號類型>列表項1

<litype=項目符號類型>列表項2

……

<litype=項目符號類型>列表項n

</UL>說明：disk●（默認）、square■、circle○<bodybgcolor="#FFFF99"><hl>花語</hl><p>各種花所代表的含義如下：</p><ul><li>玫瑰：純潔的愛</li><li>劍蘭：用心堅固</li>

<litype="circle">滿天星：愛憐</li>

<litype="circle">紫羅蘭：永恒之美</li><litype="circle">勿忘我：愛到永遠</li></ul></body>2．有序列表標記格式：<OLtype=序號類型

start=開始序號>

<LItype=序號類型>列表項1

<LItype=序號類型>列表項2

……

<LItype=序號類型>列表項n

</OL>說明：type的值為：1、a、A、i、I。2.4表格標記格式：<TABLEborder=邊框粗細bordercolor=邊框顏色width=表格寬度height=表格高度>

<tr><th>文字</th><th>文字</th></tr>……

<tr><td>d11</td><td>d12</td>……</tr>

<tr><td>d21</td><td>d22</td>……</tr>

……

</TABLE>2HTML常用標記

2.5超鏈接標記格式：<Ahref=URL>用作超鏈接的文字或圖像</A>2HTML常用標記

<a>標記符是成對標記符，主要屬性有：（1）href。鏈接文件的地址。（2）target。鏈接目標的位置。

1.指向電子郵件的鏈接

<ahref="mailto:**@**">與我聯(lián)系</a>2.指向站內文件的鏈接

<ahref="bg.htm"target=“self">花節(jié)</a>3.指向其他網(wǎng)址的鏈接

<ahref="">友情鏈接</a>2.6

圖像標記格式：<IMGsrc=URL

align=對齊方式height=圖像高度width=圖像寬度>非成對。HTML和XHTML標準指定了5種圖像對齊屬性值：left、right、top、middle和bottom。Netscape又增加了4種垂直對齊屬性：texttop、absmiddle、baseline和absbottom，InternetExplorer則增加了center。注意：不同的瀏覽器以及同一瀏覽器的不同版本對align屬性的某些值的處理方式是不同的。注意：HTML4.01不推薦使用align屬性，XHTML1.0StrictDTD不支持該屬性，同時HTML5也不再支持該屬性。2HTML常用標記

3HTML表單標記

3.1表單定義格式格式：<FORMname=此表單的名字action=被激活程序method=信息傳送方式>

……

……

</FORM>表單的制作及注意事項：Method屬性：指定表單中信息傳送給Web應用程序時所采用的方式。Get：把信息作為字符串附加在URL后面。此方式傳送信息量小，且以明文顯示，保密性差。Post：把表單中的所有信息進行包裝后再傳送，不受長度限制，且以密文顯示，保密性好。表單的制作及注意事項：Action屬性：指明表單提交后將激活的處理程序。action屬性值：提交后將數(shù)據(jù)寫入E-mail：<formaction=“mailto:**@**”>提交后交數(shù)據(jù)寫入某ASP文件<formaction=“*.asp”>3.2常用表單域標記1．<INPUT>標記格式：<INPUTtype=類型name=名稱>1.文本框：<inputtype=textname=**>

2.密碼框：<inputtype=passwordname=**>

3.復選框：

<inputtype=checkboxname=**value=**>

4.單選按鈕：

<inputtype=radioname=**value=**>

5.按鈕

<inputtype=buttonname=**value=**>2．<SELECT>標記格式：<SELECTname=表單域名稱size=大小>

<OPTION>文字</OPTION>

<OPTION>文字</OPTION>

……

</SELECT>3．<TEXTAREA>標記格式：<TEXTAREAname=表單域名稱rows=行數(shù)cols=列數(shù)>

</TEXTAREA>同一表單中所有字段的名稱必須以英文命名且不得重復，這個名稱將用于后端處理。3.3表單制作舉例圖表單范例執(zhí)行結果3.4用FrontPage設計HT

溫馨提示

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

評論

0/150

提交評論