HTML&&CSS學習筆記__studying...

day1基礎知識

點擊領取一個學習地址

點擊查看html5的標籤週期表

1·網站開發:

  1. UI設計

  2. web前端開發工程師(H5開發)

    1:設計端-代碼
    2:數據庫裏的數據-顯示到頁面上
    3:WEB三大核心技術
    4:HTML+CSS+JavaScript
    5:html:結構,CSS:樣式,JavaScript:接口(交互)

  3. web後端開發工程師

2·html結構基礎與屬性

HyperText Markup Language

1. 標籤:

1:標籤屬性:<標籤 attr1=" " attr2=" " attr3=" ">

2. 初始代碼

<!DOCTYPE html> //文檔聲明:告訴瀏覽器這是一個html文件
<html lang = "en">  //html文件的最外層標籤,包裹着所有html標籤**en表示是一個英文網站;"zh-CN"表示中文網站
	<head>
		<meta charset="UTF-8"> //元信息:是編寫網頁中的一些賦值信息
		<title>Document</title>	//設置網頁標題
	</head>
</html>
<head>	
<body>
	//顯示網頁內容
</body>
</head>

3. html註釋

`<!--註釋內容-->`
sublime中快捷鍵ctrl+/

4. HTML語義化
根據網頁中內容結構選擇合適的標籤編寫;eg.列表,段落,標題等等
好處:

1·在沒有CSS的情況下,頁面也能呈現出很好的內容結構
2·有利於SEO,讓搜索引擎爬蟲更好的理解網頁
3·方便其他設備解析(如屏幕閱讀器,盲人閱讀器等等)
4·便於團隊開發與維護

5. 標題與段落

	1)標題:雙標籤:<h1></h1> ... <h6></h6>
	規範:
	    在一個網頁中,h1標題最重要,只允許存在一次
	    h5 h6標籤在網頁中不經常使用
	2)段落:雙標籤:<p></p>

6. 文本修飾標籤?

	1)強調:1.<strong>強調1,加粗</strong> <!--強調性更強-->
	       2.<em>強調2,斜體</em>	
	2)位置:1.<sub>subscript下標</sub> 
		   2.<sup>superscript上標</sup>
	3)刪除: 1.<del>刪除文本,加刪除線</del>
		   2.<ins>插入文本,加下劃線</ins> 兩者往往配合使用,刪除後即插入應該修改的內容

7. 圖片:
單標籤:<img src = "">
屬性:

		1、圖片地址: src = "address"
		2、當圖片問題的時候,可以顯示一段友好的文字:alt = "loading text"
		3、提示信息 title = "title"
		4、圖片寬度 width:
		5、圖片高度 height: <!--添加之後網速慢的時候,可以留白並且加載,給客戶好的體驗-->
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章