HTML基礎知識總結——基礎標籤1
- HTML的中文含義：超文字標記語言。HTML語言不是程式語言，而是標記語言
- 標記的基本要求
- 通常成對出現，但也有個別但標記
- 單詞應該小寫（大寫不會錯，但不規範）
- 養成縮排的習慣
- 標籤基本組成：<標籤名 屬性名=“屬性值”></標籤名>
- 標籤在展現時分為：
5.1 行標籤：內容只會顯示在一行中，下一個標籤不會換行
5.2 塊標籤：不管內容多少，都獨佔一行
6、註釋的方法：<!—註釋內容 -->
7、標籤：單標籤：<tagName> 一個標籤代表一個功能
雙標籤：<tagName>..</tagName> 當中間有文字/標籤段落等內容
- 網頁標籤的核心結構
- 文件型別：通知瀏覽器我的HTML頁面的型別（(html1.1 html2 html3 html4 html4.5 html5 html5.5)
- 宣告寫在頁面最前 H5 <!DOCTYPE html>
- 總體結構
<html></html> 代表這個文件，所有內容應該包含其中
html 標籤中包含兩個大標籤
<head></head> 頭部，只能放和瀏覽器互動的資訊/標籤
<body></body> 身體，只能放頁面中顯示的內容/標籤
例如：
<!DOCTYPE html>
<html>
<head>
<title>titleText</title>
</head>
<body>
</body>
</html>
1、head中的內容
title標籤：頁面的標題
<title>標題資訊</title>
meta 標籤：頁面中帶有的特徵，用於通知瀏覽器，但標籤；常用屬性：http-equiva
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"> 指定瀏覽器的內容和編碼格式
<meta http-equiv="Refresh" content="3;url=http://www.baidu.com" /> 指定頁面重新整理操作
<meta name="keyword" content="HTML,CSS,JavaScript" /> 指定網頁的關鍵詞,服務於搜尋引擎(seo 搜尋引擎優化 / sem)
<meta name="description" content="這是一個html的演示文件" />
2、關於body標籤：存放所有頁面的內容，給訪問的使用者展示
<body bgcolor="yellow" background="bg.jpg"></body> 使用bgcolor表示背景色;
使用background表示背景圖案
在html中表示影象時,需要使用路徑: 和當前檔案demo.html在平級目錄下bg.png
<body background="bg.jpg"></body>、
3、在網頁中使用顏色
常見的顏色單詞：white、black、red、blue、yellow、green、gray、pink、lightblue 、darkgray
更多的方式：十六進位制表示法
4、在網頁中使用圖片
常見的格式: jpg(jpeg) gif(常見於動態圖片/小圖片/透明) png(向量格式,推薦,可以表現出透明部分) svg(用程式碼實現影象的格式)
background中的背景圖片預設鋪滿整個頁面
圖片的組織管理: 所有的頁面檔案都放在專案資料夾中,圖片放在image資料夾中
這個時候要找到圖片需要修改路徑:
相對路徑: 以檔案本身所在目錄作為參照,相對的尋找其他檔案(常用)
bg.png 影象檔案和網頁檔案在一起(平級關係)
image/bg.png 影象檔案的目錄和網頁檔案在一起
.表示當前目錄 ./images/bg.png
..表示上級目錄 ../images/bg.png .在當前代表html目錄 ..表示jd目錄(根目錄)
/表示根目錄
5、關於h標籤,標題標籤,由h1-h6(6種從大到小的字號) , 會加粗,字號變大,獨佔一行, 增加行間距
作用: 高亮,強調; 被會搜尋引擎收錄, 通常用於文章或段落或商品的標題
6、網頁中的多個空格的輸入只會被顯示為一個空格;人為的換行也會顯示為一個空格
顯示空格的方法: 代表一個 4個
顯示換行的方法: <br>
顯示分割線的方法: <hr> width:寬度屬性 align: 位置(center/left/right)
size: 粗細 color: 背景顏色
7、字型標籤: font,雙標籤,行標籤
屬性: face:字型 size: 字號 1-7 color: 字型顏色
8、段落標籤: p , 雙標籤,塊標籤 獨佔一行,自動填充段落前後間距，用於顯示獨立的一段文字(文章的段落)
9、預覽標籤 pre , 雙標籤,塊標籤
10、走馬燈標籤 marquee