HTML——網頁設計基礎

說道網頁設計,HTML是我們必不可少的一部分。基礎網頁的構成,無論怎麼變幻,都是由原聲的HTML代碼組成構成網頁。

下面我就根據工作中所用和看過的書籍一點一點總結下我們常用的HTML格式和代碼。

一、什麼是HTML。

HTM不是一段編程語言,而是一款標記語言,本身不能顯示在瀏覽器中。經過瀏覽器的編釋和編譯,才能正確反映HTML標記語言的內容。HTML從1.0到5.0經歷了巨大的變化,從單一的文本顯示功能到多功能互動,已經成爲了一款非常成熟的標記語言。

二、HTML文件的基本結構

<!doctype html>
<html>文件開始標記
<head>文件頭開始的標記
<meta http-equiv="X-UA-Compatible" content="IE=Edge" charset="utf-8">
<title>XX系統</title>
</head>文件頭結束
<body>文件主題的內容
</body>文件主題的結束
</html>文件結束的標記
這裏主要說明title和meta(元信息)

<!--說明文件頭-->





<title>XX網站</title>
<!--添加作者信息-->

<meta name="author" content="_永不言棄" >
<!--設置網頁文字及語言 -->
<meta http-equiv="X-UA-Compatible" content="IE=Edge" charset="utf-8">
<!--設置網頁定時(20秒後)跳轉-->


<meta http-equiv="refresh" content="20;url=index.html">

三、HTML主要常用標籤

3.1標題

<h1></h1>
<h2></h2>
<h3></h3>
<h4></h4>
<h5></h5>
<h6></h6>

3.2 標題字對齊屬性align

默認情況下,標題文字是左對齊的。在網頁製作過程中,常常需要選擇對其他的方式,這時我們就需要用到align屬性。


3.3 段落標記p

段落標記是文檔中最常見的標記,<p>用來起始的一個段落。

3.3 換行標記

換行標記<br>作用是在不另起一段的情況下將當前文本強制換行。

3.4 不換行標記nobr

<nobor>表示的是不換行的標記</nobor>

3.5 水平線

<hr/>

3.6 插入空格

&nbsp;

四、建立超鏈接

與自身網站頁面有關的連接被稱爲內部連接

4.1絕對路徑

絕對路徑是包括服務器規範在內的完全路徑。絕對路徑不管源文件在什麼位置都可以非常精確地找到,除非是目標文檔的位置發生變化,否則連接不會失效。

4.2相對路徑

爲了避免絕對路徑的缺陷,對於在同一站點之中的連接來說,使用相對路徑是一個很好的方法。

4.3 內部連接

<a href="# target="目標窗口的打開方式 " >

屬性值
含義
-self 在當前頁面中打開連接
-blank 在一個全新的空白窗口中打開連接
-top 在頂層框架中打開連接,也可以理解爲在根框架中打開連接
-parent 在當前框架的上一層裏打開連接

4.4 錨點連接

錨點到本頁面中的位置

<a href="#1" >商品名稱</a>

<a href="#2" >產品特點</a>

<a href="#3" >產品規格</a>

<a  neme="1">XX商品</a>

<a  neme="2">XX產品特點</a>

<a  neme="3">XX規格</a>

錨點到其他頁面的位置

<a href="index.html#1"></a>對應連接到index.html中name=1的位置

4.5 連接到外部網站

在設置友情鏈接時,需要打開HTTP協議進行外部連接訪問。

<a href="wwww.baidu.com" >百度</a>

4.6 連接到E-mail

<a href="mailto:郵件地址">。。。</a>

4.7 連接到FTP

FTP代表文件傳輸協議,一個FTP站點通常包含一些上傳和下載文件的文件目錄。

大部分FTP網站需要使用用戶名和密碼來登錄。


當然還有其他的一些連接方式,例如文件下載,連接到Telnet等。這些都會可以用a標籤實現。


HTML基礎就先講到這裏,後面退出DIV設計網頁格式已經網頁分框的實現。





發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章