靜態網頁開發技術

• HTML技術
• • 1.HTML概述
  • 2.HTML文本標簽
  • 3.圖片標簽

HTML技術

1.HTML概述

HTML稱為超文本標記語言，是一種標識性的語言。它包括一系列標簽．通過這些標簽可以將網絡上的文檔格式統一，使分散的Internet資源連接為一個邏輯整體。HTML文本是由HTML命令組成的描述性文本，HTML命令可以說明文字，圖形、動畫、聲音、表格、鏈接等。

2.HTML文本標簽

①外觀相關標簽

• HTML為單獨的詞或者句子定義了兩種外觀樣式:物理樣式和邏輯樣式。物理樣式說明標簽之間的文句的特定外貌,是固定效果。
  

• 邏輯樣式并不能像物理字體那樣明確知道字體的顯示方式，這些邏輯字體標簽并不指明字體如何顯示，而是讓Web瀏覽器自行決定顯示方式，不同的瀏覽器解釋效果可能不同。
  

②結構相關標簽

• 段落標簽 ：< p >，它可將標簽間的文字設置為一個 新的段落，段落 標簽可以有align對齊(用來設置文本的對齊,屬性值可以為left.right和center等)等屬性。< br> 是換行標簽，瀏覽器解析HTML頁面時，會忽略源代碼中多余的空格、空行等。這里 < p> 是雙標簽,要求既要有開始標簽，又要有結束標簽;而**< br>**是單標簽,結束標簽可以和開始標簽起寫為 < br/> ，也可以省略結束標記。
• 標題標簽 <h? …<./h >,其中?代表從1~6的數字,hl字體最大,h6字體最小。這些標簽的作用是設置標題字體的大小，顯示黑體字,并自動插人空行,可設置align對齊等屬性。
• 區塊標簽 < div> 和 < span> ,HTML可以通過這兩個標簽將元素組合起來。div 標簽可以把文檔分割為獨立的、不同的部分，一般我們在網頁通過div來布局定位網頁中的每個區塊，它是一個是用來為HTML文檔內大塊內容提供結構和背景的塊級元素。標簽本身沒有特定的含義，它最終目的是與CSS一同使用,給設計者一種組織能力,用于文檔布局,取代了傳統的表格定 義布局的老式方法。span標簽是一個內聯元素,沒有實際意義，它的存在只是為了應用樣式，給一段內容加上span標記可以通過在其上定義的樣式來設定其內容顯示效果。
  -示例1

< body>大家好<p align= "center" >我是分段標記</p> 看清楚哦<br />我是換行標記 < hr> 這里是正文.... <h1>我是HI標題字,我最大</hl> <h2>我是H2標題字< /h2> <h6>我是H6標題字，我最小</h6> < hr> <div>這里是頁腳部分哦</div> </body>

③字符實體

• 對于HTML代碼而言,有些字符有特別的含義，比如小于號<就表示HTML標簽的開始,這個小于號是不顯示在我們最終看到的網頁里的。常見的情況有兩種:(1)HTML中有特殊含義的字符。如:<>”&空格等;(2)無法用鍵盤直接輸人的字符。如:￥fX+∈等。為了解決在瀏覽器中顯示被用作實現保留字符或無法直接由鍵盤直接輸人的字符，HTML提供了特別的字符實體功能，專門用來顯示有特殊含義的字符和無法直接用鍵盤輸人的字符。
• 一個字符實體(character entities)是由三部分組成的:(1)一個“&”符號; (2)字符專用名稱或者字符代號; (3)一個“;”符號。
  

3.圖片標簽

HTML網頁中插人圖片用的就是標簽，它的眾多屬性可以控制圖片的路徑、尺寸和替換文字等各種功能。圖片主要有src、title、alt、height、width等屬性，具體含義如下，

• src用來設置圖像文件的絕對路徑和相對路徑URL;

• title用來設置鼠標懸停在圖片上時顯示的文字;

• alt用來設置替代顯示文本;

• height、width用來設置圖像高度、寬度,單位默認為像素px。

若某一文件夾中包含網頁文件picture. html、圖片文件heart. png、包含圖片lotus. pnp的文件夾image，它們的位置如圖2-3所示。則可以使用如下的代碼片段，實現在pieturerhtml網頁文件中顯示這兩個圖片。具體body標簽中代碼如下:

< body>
<img src=’ ‘heart. png" alt= “心形圖片”/>
< /body><ing src=’ inag/ lotus. jPg" width= "200 height-”200”title- "荷花圖片”/>

總結

以上是生活随笔為你收集整理的静态网页开发技术的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。