<!DOCTYPE html> <html lang="en"> <head> <!-- <head> 元素是所有頭部元素的容器。 <head> 內的元素可包含腳本,指示瀏覽器在何處可以找到樣式表,提供元信息,等等。 以下標籤都可以添加到 head 部分: <title>、<base>、<link>、<meta>、<script> 以及 <style>。 --> <meta charset="UTF-8"> <meta http-equiv="Refresh" content="5;url=http://www.w3school.com.cn" /> <!--這一句的功能是 使得 頁面5秒後 指向這個網址--> <meta name="author" content="zs"><!--作者--> <meta name="revised" content="zs,2016.7.31"><!--revised 英文意思是經過修正的--> <meta name="generator" content="WebStorm"><!--編輯器,--> <meta name="description" content="描述"/><!--關於文檔的描述--> <!--一些搜索引擎會利用 meta 元素的 name 和 content 屬性來索引頁面。--> <meta name="keywords" content="學些H5"/><!--定義頁面關鍵詞--> <!-- 元數據(metadata)是關於數據的信息。 <meta> 標籤提供關於 HTML 文檔的元數據。元數據不會顯示在頁面上,但是對於機器是可讀的。 典型的情況是,meta 元素被用於規定頁面的描述、關鍵詞、文檔的作者、最後修改時間以及其他元數據。 <meta> 標籤始終位於 head 元素中。 元數據可用於瀏覽器(如何顯示內容或重新加載頁面),搜索引擎(關鍵詞),或其他 web 服務。 --> <title> 這是標題哦~! </title> <!-- <title> 標籤定義文檔的標題。 title 元素在所有 HTML/XHTML 文檔中都是必需的。 title 元素能夠: 定義瀏覽器工具欄中的標題 提供頁面被添加到收藏夾時顯示的標題 顯示在搜索引擎結果中的頁面標題 --> <base href="https://www.baidu.com/?tn=95505140_hao_pg"/> <base target="_blank"/> <!-- <base> 標籤爲頁面上的所有鏈接規定默認地址或默認目標(target): href 規定鏈接的地址 target 規定打開新鏈接 是在新窗口還是怎麼 --> <link rel="stylesheet" type="text/css" href="mystyle.css" /> <!-- <link> 標籤定義文檔與外部資源之間的關係。 <link> 標籤最常用於連接樣式表: --> <style> </style> <!-- <style> 標籤用於爲 HTML 文檔定義樣式信息。 您可以在 style 元素內規定 HTML 元素在瀏覽器中呈現的樣式: --> <script> /*script 寫JS的*/ </script> </head> <body> </body> </html>具體效果如下:
代碼解釋如下:
主要是介紹了head標籤內部的東西。
<!-- <head> 元素是所有頭部元素的容器。 <head> 內的元素可包含腳本,指示瀏覽器在何處可以找到樣式表,提供元信息,等等。 以下標籤都可以添加到 head 部分: <title>、<base>、<link>、<meta>、<script> 以及 <style>。 -->
meta主要是HTML文檔的一些信息。
<meta charset="UTF-8"> <meta http-equiv="Refresh" content="5;url=http://www.w3school.com.cn" /> <!--這一句的功能是 使得 頁面5秒後 指向這個網址--> <meta name="author" content="zs"><!--作者--> <meta name="revised" content="zs,2016.7.31"><!--revised ,應該也是作者信息。英文意思是經過修正的--> <meta name="generator" content="WebStorm"><!--編輯器,--> <meta name="description" content="描述"/><!--關於文檔的描述--> <!--一些搜索引擎會利用 meta 元素的 name 和 content 屬性來索引頁面。--> <meta name="keywords" content="學些H5"/><!--定義頁面關鍵詞--> <!-- 元數據(metadata)是關於數據的信息。 <meta> 標籤提供關於 HTML 文檔的元數據。元數據不會顯示在頁面上,但是對於機器是可讀的。 典型的情況是,meta 元素被用於規定頁面的描述、關鍵詞、文檔的作者、最後修改時間以及其他元數據。 <meta> 標籤始終位於 head 元素中。 元數據可用於瀏覽器(如何顯示內容或重新加載頁面),搜索引擎(關鍵詞),或其他 web 服務。 -->在這裏,完成了一個功能,就是 打開網頁5秒之後跳轉到指定網頁的功能。
主要是運用了meta標籤
<meta http-equiv="Refresh" content="5;url=http://www.w3school.com.cn" /> <!--這一句的功能是 使得 頁面5秒後 指向這個網址-->還有就是給頁面設置一些信息和關鍵詞
<meta name="description" content="描述"/><!--關於文檔的描述--> <!--一些搜索引擎會利用 meta 元素的 name 和 content 屬性來索引頁面。--> <meta name="keywords" content="學些H5"/><!--定義頁面關鍵詞-->這兩個挺重要的
title標籤可以設置網頁標題。
<title> 這是標題哦~! </title> <!-- <title> 標籤定義文檔的標題。 title 元素在所有 HTML/XHTML 文檔中都是必需的。 title 元素能夠: 定義瀏覽器工具欄中的標題 提供頁面被添加到收藏夾時顯示的標題 顯示在搜索引擎結果中的頁面標題 -->
base標籤 裏的屬性規定一些默認的 東西是什麼
<base href="https://www.baidu.com/?tn=95505140_hao_pg"/> <base target="_blank"/> <!-- <base> 標籤爲頁面上的所有鏈接規定默認地址或默認目標(target): href 規定鏈接的地址 target 規定打開新鏈接 是在新窗口還是怎麼 -->
link標籤 規定了 css文件
<link rel="stylesheet" type="text/css" href="mystyle.css" /> <!-- <link> 標籤定義文檔與外部資源之間的關係。 <link> 標籤最常用於連接樣式表: -->
style標籤跟CSS文件一樣設置樣式
<style> </style> <!-- <style> 標籤用於爲 HTML 文檔定義樣式信息。 您可以在 style 元素內規定 HTML 元素在瀏覽器中呈現的樣式: -->
script標籤寫一些交互性 響應的代碼
<script> /*script 寫JS的*/ </script>