PHP開發從入門到精通課件第3章_第1頁
PHP開發從入門到精通課件第3章_第2頁
PHP開發從入門到精通課件第3章_第3頁
PHP開發從入門到精通課件第3章_第4頁
PHP開發從入門到精通課件第3章_第5頁
已閱讀5頁，還剩11頁未讀， 繼續免費閱讀

下載本文檔

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

文檔簡介

第3章HTML基礎 HTML即HypertextMarkedLanguage（超文本標記語言），是一種用來制作超文本文檔的簡單標記語言。用HTML編寫的超文本文檔稱為HTML文檔，它能獨立于各種操作系統平臺（如UNIX、Windows等）。自1990年以來HTML就一直被用作WWW的信息表示語言，用于描述Homepage的格式設計和它與WWW上其他Homepage的連接信息。使用HTML語言描述的文件需要通過瀏覽器顯示出效果。

所謂超文本，是因為它可以加入圖片、聲音、動畫、影視等內容，可以從一個文件跳轉到另一個文件，與世界各地主機的文件的連接。HTML只不過是組合成一個文本文件的一系列標簽。【例3-1】HTML列表標記實例 <br>換行標記 <br>是一個很簡單的標記，它沒有結束標記，用來創建一個回車換行。在<br>的使用上還有一定的技巧：如果把<br>加在<p></p>標記對的外邊，將創建一個大的回車換行，即<br>前邊和后邊的文本的行與行之間的距離比較大；若放在<p></p>的里邊，則<br>前邊和后邊的文本的行與行之間的距離將比較小。 <blockquote></blockquote>縮進標記

在<blockquote></blockquote>標記對之間加入的文本將會在瀏覽器中按兩邊縮進的方式顯示出來。

列表

在HTML中列表分為三種：無序列表、有序列表和定義列表。無序列表用<ul>來定義，格式為：<ul><li>無序列表1<li>無序列表2<li>無序列表3</ul>【例3-1】HTML列表標記實例 <hr> <hr>標記是在HTML文檔中加入一條水平線，它可以直接使用，具有size、color、width和noshade屬性。size是設置水平線的厚度，而width是設定水平線的寬度，默認單位是像素。color屬性不再多講。noshade屬性不用賦值，而是直接加入標記即可使用，它是用來加入一條沒有陰影的水平線（不加入此屬性，水平線將有陰影）。 <body></body>【例3-2】HTML文本標記實例 HTML中有許多用于文本字體的形狀、大小、顏色等描述的標記。 <pre></pre><pre></pre>標記對用來對文本進行格式化處理。被包圍在pre元素中的文本通常會保留空格和換行符，文本也會呈現為等寬字體。 <h1></h1>……<h6></h6> HTML語言提供了一系列對文本中的標題進行操作的標記對：<h1></h1>……<h6></h6>，即共有6對標題的標記對。<h1></h1>是最大的標題，而<h6></h6>則是最小的標題，也即標記中h后面的數字越大標題文本越小。如果HTML文檔中需要輸出標題文本，就可以使用這6對標題標記對中的任何一對。

【例3-2】HTML文本標記實例<b></b><i></i><u></u>

經常使用Word的人對這3對標記對一定很快就能掌握。<b></b>用來使文本以黑體字的形式輸出；<i></i>用來使文本以斜體字的形式輸出；<u></u>用來使文本加下劃線的形式輸出。 <tt></tt><cite></cite><em></em><strong></strong>

這些標記對的用法和上面的一樣，差別只在于輸出的文本字體不太一樣。<tt></tt>用來輸出打字機風格字體的文本；<cite></cite>用來輸出引用方式的字體，通常是斜體；<em></em>用來輸出需要強調的文本（通常是斜體加粗體）；<strong></strong>用來輸出加重文本（通常也是斜體加粗體）。

【例3-2】HTML文本標記實例<font></font> <font></font>是一對很有用的標記對，它可以對輸出文本的字體大小、顏色進行隨意地改變，這些改變主要是通過對它的兩個屬性size和color的控制來實現的。size屬性用來改變字體的大小，可以取值：–1、1和+1；color屬性則用來改變文本的顏色，顏色取值十六進制RGB顏色碼或HTML語言給定的顏色常量名。如： <fontcolor="yellow"size=5>表示即將顯示的字符為黃色五號字。 <fontcolor="gray"size=3>表示即將顯示的字符為灰色三號字。 <address></address> <address>標記通常用于說明文檔的作者、與作者聯系的方法（如電子郵件地址）和修訂日期，它一般是一個文件的最后部分。【例3-3】HTML圖像標記實例

本例主要涉及兩個標記：圖像標記<img>和鏈接標記<a>，<a>標記會在【例3-5】中詳細說明，在此不做解釋，重點講解圖像標記<img>。

在Web頁面中，圖像是必不可少的一個元素。圖像的標記為<img>，語法格式如下：<imgsrc="圖像的URL"alt=""width=""height=""align=""border="">

其中各屬性的含義如下：

src：圖像的URL地址。 alt：在瀏覽器未完全讀入圖像或者瀏覽器顯示不出圖像時，在圖像位置顯示的文字，同時也是當鼠標移動到圖像上時顯示的文本。 width：圖像的寬度，默認單位也是像素。 height：圖像的高度，默認單位也是像素。 align：圖像和文字的對齊方式，有left、middle、right、top和bottom5種方式。 border：圖像邊框厚度，默認單位是像素。 name：圖像的名稱。【例3-4】HTML表格標記實例 <table></table>標記對用來創建一個表格，它的屬性如表3-2所示。表3-2<table>標記的屬性【例3-5】HTML鏈接標記實例 超級鏈接是HTML的基本結構，它是指把并不連續的兩段文字或者兩個文件聯系起來。網頁中超級鏈接的分類有很多方式，有的分為超文本與超鏈接，有的分為外部鏈接、內部鏈接、郵件鏈接和錨記鏈接以及空鏈接。 鏈接的語法格式<ahref="鏈接的地址或者文件"target="鏈接網頁打開的方式"name="鏈接的名稱">鏈接顯示的文本</a>href屬性：本標記對的屬性href是無論如何不可缺少的，標記對之間加入需要鏈接的文本或圖像（鏈接圖像即加入<imgsrc="">標記）。href的值可以是URL形式，即網址或相對路徑，也可以是mailto:形式，即發送E-mail形式。target屬性：此屬性是指定鏈接的地址打開窗口的形式，共有4個取值。【例3-6】HTML表單標記實例 <form></form> <form></form>標記對用來創建一個表單，也即定義表單的開始和結束位置，在標記對之間的一切都屬于表單的內容。<form>標記具有action、method和target屬性。具體如表3-5所示。【例3-7】HTML框架標記實例——保護環境網站

框架是由英文Frame翻譯過來的，它可以用來向瀏覽器窗口中裝載多個HTML文件。即每個HTML文件占據一個框架，而多個框架可以同時顯示在同一個瀏覽器窗口中，它們組成了一個最大的框架，也即是一個包含多個HTML文檔的HTML文件（我們稱之為框架集）。框架通常的使用方法是在一個框架中放置導航欄目（帶可供選擇的鏈接），然后將導航項所對應的鏈接跳轉目標HTML文件顯示在另一個框架中。我們平時用到的郵箱和聊天室很多都是采取框架結構來布局的。

框架的基本結構如下：<frameset><frame><frame>……</frameset>

框架的基本結構分為兩部分：標記符frameset和標記符frame，其中frameset相當于前面實例中講到的“房間”，專用的名詞為“框架集”。所謂框架集就是指構造整個框架結構的文檔，它不包含任何可以顯示的內容，只包含如何組織各個框架的信息和框架中的初始頁面信息。而每一個<frame>就是這個房間里面包含的每一個物品。【例3-8】HTML多媒體標記實例

在主頁中加入聲音有三種方法：

（1）用<bgsound>標記加入背景音樂。

（2）用<embed>標記嵌入聲音。

（3）用ActiveX控件中的ActiveMovie控件。【例3-9】<marquee>標記實例

文字移動標記<marquee>的應用非常廣泛，既可以用于滾動文字，也可以用于滾動圖片等元素。語法如下：<marquee>

滾動的文字或者圖片等</marquee><marquee>標記有以下一些主要的屬性：direction（方向）：定義滾動文本的移動方向。該屬性有4種取值，分別為left（向左移動）、right（向右移動）、up（向上移動）、down（向下移動），默認值為left。behavior（行為、方式）：定義滾動文本的滾動方式。該屬性有3個取值，分別為scroll（一圈圈滾動）、slide（只滾動一次）和alternate（來回滾動），默認值為scroll。loop（循環）：指定循環滾動的次數。若沒有設置該值，則表示無限次循環。scrollamout（滾動的速度）：用來設置滾動文本的速度。該屬性的值是數字，數字越大，移動的越快。scrolldelay（滾動延時）：定義滾動字幕移動的延時。該屬性的值是數字，單位是千分之一秒。align（對齊方式）：定義滾動文本與周圍其他頁面元素之間的對齊方式。該屬性有3個取值：top（頂端對齊）、middle（居中對齊）、bottom（底端對齊）。bgcolor（背景顏色）：定義滾動文本的背景色。該屬性的值可以是16進制數字（如#ff0000）或者具體的顏色名稱（如red）等。height（高度）和width（寬度）：定義滾動文本的尺寸。兩個屬性的值都是數字，表示像素數。hspace（垂直間距）和vspace（水平間距）：定義滾動文本與周圍頁面元素之間的間隔。兩個屬性的值

溫馨提示

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

評論

0/150

提交評論