文章目錄
- 一、HTML5概述
- 二、檔案結構
- 三、文本元素
- 四、超鏈接和路徑
- i.超鏈接屬性
- ii.相對路徑與絕對路徑
一、HTML5概述
一種超文本標記語言, HTML5其中重要的三項技術分別為:HTML5核心規范、CSS、JavaScript,
二、檔案結構
<!DOCTYPE html> //檔案型別宣告
<html lang=”zh-cn”> //表示檔案開始(英文用en)
<head> //包含檔案元素據開始(不可見)
<meta charset=”utf-8”> //宣告字符編碼
<title>基本結構</title> //設定檔案標題
</head> //包含檔案元素據結束
<body> //表示HTML檔案內容(可見)
xxxxxxxxxxxxx
</body>
</html> //表示檔案結束
注:
Doctype 檔案型別宣告 <!DOCTYPE html>
html(標簽)雙標簽,頭尾呼應
head 包含元資料內容 (頁面不可見)
meta 提供關于檔案的資訊
title 設定標題
body 包含檔案內容的元素 (瀏覽器可見區域部分)
(雙標簽 例如head后直接加tab鍵可以直接出現html格式,前提是檔案已保存,)
三、文本元素
| 元素名稱 | 說明 |
|---|---|
| a | 生成超鏈接 |
| br | 強制換行 |
| wbr | 可安全換行 |
| b | 標記一段文字但不強調 |
| strong | 表示重要 |
| i | 表示外文或科學術語 |
| em | 表示強調 |
| code | 表示計算機代碼 |
| var | 表示程式輸出 |
| samp | 表示變數 |
| kdb | 表示用戶輸入 |
| abbr | 表示縮寫 |
| cite | 表示其他作品的標題 |
| del | 表示被洗掉的文字 |
| s | 表示文字已不再確認 |
| dfn | 表示術語定義 |
| mark | 表示與另一段背景關系有關的內容 |
| q | 表示引自他處的內容 |
| rp | 與ruby元素結合使用,標記括號 |
| rt | 與ruby元素結合使用,標記括號 |
| ruby | 表示位于表意文字上方或右方的注音符號 |
| bdo | 控制文字的方向 |
| small | 表示小號字體內容 |
| sub | 表示下標字體 |
| sup | 表示上標字體 |
| time | 表示時間或日期 |
| u | 標記一段文字但不強調 |
| span | 通用元素,沒有任何語意,一般配合CSS修飾, |
注:
ctrl+?=注釋
b、strong 加粗
i、var傾斜
s、del 加洗掉線
u、ins 加下劃線
q 加雙引號
mark 黃色背景黑色字
四、超鏈接和路徑
i.超鏈接屬性
| 屬性名稱 | 說明 |
|---|---|
| href | 指定元素所指資源的URL |
| hreflang | 指向的鏈接資源所使用的語言 |
| media | 說明所鏈接資源用于哪種設備 |
| rel | 說明檔案與所鏈接資源的關系型別 |
| target | 指定用以打開所鏈接資源的瀏覽環境 |
| type | |
| target屬性 | |
| 屬性名稱 | 說明 |
| -------- | ------------------------------ |
| blank | 在新視窗或標簽頁中打開檔案 |
| parent | 在父窗框組(frameset)中打開檔案 |
| _self | 在當前視窗打開檔案(默認) |
| _top | 在頂層視窗打開檔案 |
例如:
<a href="http:www.baidu.com" target="_blank">
ii.相對路徑與絕對路徑
1.絕對路徑: 當整個目錄轉移到另外的盤符或其他電腦時,目錄結構一旦出現任何變化,鏈接當即失效,
<a href="file:///磁盤符+目錄層次x.html">名稱</a>
2.相對路徑條件: 必須檔案都在一個磁盤或目錄下
注: 如果一個主目錄有多個子目錄層次等其他情況 使用目錄語法:
同一個目錄: index2.html或./index2.html;
在子目錄: xxx/index2.html;
在孫子目錄: xxx/xxx/index2.html;
在父目錄: ../index2.html;
在爺爺目錄: ../ ../index2.html;
3.錨點設定:
//鏈接
<a href="#1">第一章</a> <a href="#2">第二章</a> <a href="#3">第三章</a>
//錨點
<a name="1"></a> <a id="3"></a>
轉載請註明出處,本文鏈接:https://www.uj5u.com/qianduan/301300.html
標籤:其他
