設計師學習HTML CSS之路 03

2021-09-24 06:49:55 字數 1727 閱讀 6550

不了解前端的ui不是好美工,以下是慕課網html+css基礎教程學習筆記,不廢話,start!

3-1 ul無序列表標籤
語法:

解釋:

unordered list 無序列表

3-2 ol有序列表標籤
語法:

列表

列表

解釋:

ordered list有序列表

列表

列表 3-3 div在排版中的作用

語法:

標籤內容

解釋:

division 相當於乙個容器,劃分網頁中的各個邏輯部分

3-4 給div命名

語法:

..

3-5 table標籤

建立**的四個要素

... 開始與結束標籤

... 優先顯示**結構,也可以將**一部分一部分分開

... **的一行

... **的乙個單元格(單元格的數量決定了**有多少列)

**的頭部單元格,**表頭

標題一

標題二標題三

單元格1

單元格2

單元格3

單元格1

單元格2

單元格3

複製**

標題一

標題二標題三

單元格1

單元格2

單元格3

單元格1

單元格2

單元格3

3-6 用css樣式,加入邊框

table **在沒有新增 css 樣式之前,是沒有邊框的.

複製**
3-7 caption標籤,為**新增標題和摘要

**還是需要新增一些標籤進行優化,可以新增標題摘要

摘要的內容是不會在瀏覽器中顯示出來的。它的作用是增加**的可讀性(語義化),使搜尋引擎更好的讀懂**內容,還可以使螢幕閱讀器更好的幫助特殊使用者讀取**內容。

語法:

標題用以描述**內容,標題的顯示位置:**上方。

語法:

標題文字

複製**

標題文字……

……複製**

這是**的標題

標題一標題二內容一

內容二

設計師學習HTML CSS之路 02

不了解前端的ui不是好美工,以下是慕課網html css基礎教程學習筆記,不廢話,start 2 1 語義化 語義化,讓你的網頁更好的被搜尋引擎理解。標籤的用途 我們學習網頁製作時,常常會聽到乙個詞,語義化。那麼什麼叫做語義化呢,說的通俗點就是 明白每個標籤的用途 在什麼情況下使用此標籤合理 比如,...

設計師學習HTML CSS之路 04

不了解前端的ui不是好美工,以下是慕課網html css基礎教程學習筆記,不廢話,start 4 1 使用a標籤,鏈結到另乙個頁面語法 title的目的不僅僅是劃過顯示的文字,他還有的作用是語義化 點我試試 title p2g作品集 點我試試 複製 4 2 在新建瀏覽器視窗中開啟鏈結 a標籤預設是上...

設計師學習HTML CSS之路 06

不了解前端的ui不是好美工,以下是慕課網html css基礎教程學習筆記,不廢話,start 6 1 認識css樣式 css全稱 cascading style sheets疊層樣式表 主要用於定義html內容在瀏覽器內的顯示樣式,如文字大小 顏色 字型加粗等。如下列 p 複製 6 2 css樣式的...