HTML 頭部


HTML <head>


#查看線上實例

實例

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<title>我的 HTML 的第一页</title>
</head>

<body>
<p>浏览器中包含body元素的内容。</p>
<p>浏览器的标题包含title元素的内容</p>
</body>

</html>

執行實例»

點擊"執行實例"按鈕查看線上實例
使用<base> 定義頁面中所有連結預設的連結目標位址。

實例

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
<base href="http://www.php.cn/images/" target="_blank">
</head>

<body>
<img src="logo.png"> - 注意这里我们设置了图片的相对地址。能正常显示是因为我们在 head 部分设置了 base 标签,
    该标签指定了页面上所有链接的默认 URL,所以该图片的访问地址为 "http://www.php.cn/images/logo.png"
<br><br>
<a href="http://www.php.cn">php中文网</a> - 注意这个链接会在新窗口打开,即便它没有 target="_blank" 属性。
因为在 base 标签里我们已经设置了 target 属性的值为 "_blank"。

</body>
</html>

#執行實例»

點擊"運行實例" 按鈕查看線上實例
使用<meta> 元素來描述HTML文件的描述,關鍵字,作者,字元集等。

實例

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<title>php中文网(php.cn)</title> 
<meta name="description" content="Free Web tutorials">
<meta name="keywords" content="HTML,CSS,XML,JavaScript">
<meta name="author" content="Ståle Refsnes">
<meta charset="UTF-8">
</head>
<body>

<p>所有 meta 标签显示在 head 部分...</p>

</body>
</html>

#執行實例»

點擊"運行實例" 按鈕查看線上實例


HTML <head> 元素

<head> 元素包含了所有的頭部標籤元素。在 <head>元素中你可以插入腳本(scripts), 樣式文件(CSS),以及各種meta資訊。

可以加入在頭部區域的元素標籤為: <title>, <style>, <meta>, <link>,  <script>, <noscript>, and < base>.


HTML <title> 元素

<title> 標籤定義了不同文件的標題。

<title> 在 HTML/XHTML 文件中是必須的。

<title> 元素:

  • 定義了瀏覽器工具列的標題

  • 當網頁加入到收藏夾時,顯示在收藏夾中的標題

  • 顯示在搜尋引擎結果頁面的標題

一個簡單的HTML 文件:

<!DOCTYPE html>
<html>
<head> 
<meta charset="utf-8"> 
<title>文档标题</title>
</head>
<body>
文档内容......
</body>
</html>

HTML <base> 元素

<base> 標籤描述了基本的連結位址/連結目標,該標籤作為HTML文件中所有的連結標籤的預設連結:

<head>
<base href="http://www.php.cn/images/" target="_blank">
</head>
#

HTML <link> 元素

<link> 標籤定義了文件與外部資源之間的關係。

<link> 標籤通常用於連結到樣式表:

#
<head>
<link rel="stylesheet" type="text/css" href="mystyle.css">
</head

HTML <style> 元素

<style> 標籤定義了HTML文件的樣式文件引用位址.

在<style> 元素中你需要指定樣式檔來渲染HTML文件:

#
<head>
<style type="text/css">
body {background-color:yellow}
p {color:blue}
</style>
</head

HTML <meta> 元素

meta標籤描述了一些基本的元資料。

<meta> 標籤提供了元資料.元資料也不顯示在頁面上,但會被瀏覽器解析。

META元素通常用於指定網頁的描述,關鍵字,文件的最後修改時間,作者,和其他元資料。

元資料可以使用於瀏覽器(如何顯示內容或重新載入頁面),搜尋引擎(關鍵字),或其他網路服務。

<meta>一般放置於<head>區域

#<meta> 標籤- 使用實例

為搜尋引擎定義關鍵字:

<meta name="keywords" content="HTML, CSS, XML, XHTML, JavaScript"

#為網頁定義描述內容:

<meta name="description" content="Free Web tutorials on HTML and CSS"

定義網頁作者:

<meta name="author" content="Hege Refsnes"

每30秒刷新目前頁面:

<meta http-equiv="refresh" content="30"
#

HTML <script> 元素

<script>標籤用於載入腳本文件,如: JavaScript。

<script> 元素在以下章節會詳細描述。


HTML head 元素

##描述## <head>#<title><base><link>定義了HTML文件中的元資料定義了客戶端的腳本檔案
標籤
定義了文件的資訊
定義了文件的標題
#定義了頁面連結標籤的預設連結位址
定義了一個文件與外部資源之間的關係##<meta>
<script>
#########<style>#########定義了HTML文件的樣式檔###############