掌握基本的css編碼，包括以下但不限於：
* 了解css的定義、概念、發展簡史
一、相關css屬性
1、border-collapse屬性
border-collapse屬性設定**的邊框是摺疊成乙個還是像html標準樣式一樣分開顯示。
屬性值：
separate：邊框分開。
collapse：在可能情況下邊框摺疊成乙個單一的邊框。
initial：設成預設值：separate。
inherit：從父元素繼承。
2、text-indent屬性
text-indent屬性指定在乙個段落當中第一行的縮排值。
可以使用em。em與元素字型大小（font-size）有關，自適應字型大小，1em含義是當前字型尺寸的1倍，2em是當前字型尺寸的2倍。
例如：字型大小為12px，2em為24px。
3、list-style屬性
list-style屬性可使用乙個語句設定所有列表屬性，可以設定的屬性按順序為：list-style-type, list-style-position, list-style-image，如果設定時這三個屬性當中的某個屬性未設定，則使用屬性的預設值。
css 語法：
list-style: list-style-type
list-style-position
list-style-image|initial|inherit;
注意：html中可使用標籤的type屬性設定列表專案符號的型別，有：none（無），disc（實心圓，預設值），circle(空心圓)，square（實心方塊）。
4、box-shadow屬性
box-shadow屬性為乙個元素新增乙個或多個陰影。
css語法：
box-shadow: none|h-shadow v-shadow blur spread color |inset|initial|inherit;
屬性值：
none：無陰影，預設值。
h-shadow：必須填寫。陰影的水平位置，可以為負值。
v-shadow：必須填寫。陰影的垂直位置，可以為負值。
blur：可選，模糊距離。
spread：可選，陰影的尺寸，指陰影外延出去的總長度，可以為負值。
color：可選，陰影的顏色。
inset：可選，將陰影從外部陰影(outset)改為內部陰影。
initial：這為預設值。
inherit：繼承父元素的屬性值。
5、position屬性
position屬性指定乙個元素使用的位置的方法。
css語法：
position: static|absolute|fixed|relative|initial|inherit;
屬性值：
static：預設值。元素以原文件流的方式呈現。
initial：設為預設值。
inherit：繼承它的父元素。
二、偽類（pseudo-classes）和偽元素（pseudo-elements）
1、偽類
css的偽類用於設定元素的特殊狀態，用於當已有元素處於某個狀態時，為其新增對應的樣式，這個狀態是根據使用者行為而動態變化的。例如，它可以用於：當滑鼠在元素上時它的樣式，訪問過及未訪問過超連結樣式的不同，當元素獲得滑鼠焦點時的樣式。
css語法：
selector:pseudo-class
css偽類：
（1） a:active 選擇活躍鏈結。
（2） input:checked 選擇每乙個被選中的元素。
（3） input:disabled 選擇每乙個無效的元素。
（4） p:empty 選擇每乙個沒有子元素的元素。
（5） input:enabled 選擇每乙個已啟用的元素。
（6） p:first-child 選擇每乙個是其父元素第乙個子元素的元素。
（7） p:first-of-type 選擇每乙個使其父元素第乙個子元素的元素。
（8） input:focus 選擇獲得焦點的元素
（9） a:hover 選擇滑鼠在其上面的鏈結。
（10） input:in-range 選擇元素的值在制定範圍的元素。
（11） input:invalid 選擇所有有無效值的元素。
（12） p:lang(it) 選擇所有以lang屬性開頭的元素。
（13） p:last-child 選擇是其父元素最後乙個子元素的元素。
（14） p:last-of-type 選擇所以是其父元素最後乙個元素的元素。
（15） a:link 選擇所以未訪問過的鏈結。
（16） :not(p) 選擇所有不是元素的元素。
（17） p:nth-child(2) 選擇每乙個是其父元素第二個子元素的元素。
（18） p:nth-last-child(2) 選擇每乙個從後往前數是其父元素第二個子元素的元素。
（19） p:nth-last-of-type(2) 選擇每乙個從後往前數是其父元素第二個元素的元素。
（20） p:nth-of-type(2) 選擇每乙個是其父元素第二個元素的元素。
（21） p:only-child 選擇每乙個是其父元素唯一元素的元素。
（22） input:optional 選擇沒有「必須」屬性的元素。
（23） input:out-of-range 選擇值在指定範圍之外的元素。
（24） input:read-only 選擇唯讀屬性的元素。
（25） input:read-write 選擇不是唯讀的元素。
（26） input：required 選擇有乙個「required」屬性的元素。
（27） root 選擇文件的根元素。
（28） #news:target 選擇目前活躍的#news元素。
（29） input:valid 選擇所有有valid值的元素。
（30） a:visited 選擇所有被訪問過的鏈結。
2、偽元素
css的偽元素用於設定部分元素的樣式，用於建立一些不在文件樹中的元素，並為其新增樣式。。例如：設定乙個元素第一行或第乙個字母的樣式，在乙個元素的內容前或後插入內容。
css語法：
selector::pseudo-element
注意：css3中，偽元素用「：：」，偽類用「：」。
css偽元素：
（1） p::after：在每乙個元素內容後插入些內容。
（2） p::before：在每乙個元素後插入些內容。
（3） p::first-letter：選擇每乙個元素的第乙個字母。
（4） p::first-line：選擇每乙個元素的第一行。
（5） p::selection：選擇使用者已選擇的元素的一部分。
三、遇到問題：如何修改placeholder屬性
placeholder屬性指定乙個簡短的提示，說明輸入的期望值（比如期望值或簡短描述）,在使用者輸入值前顯示。placeholder屬性可用於以下型別：text，search，url，tel，email，password.
placeholder內容預設為灰色，可使用::placeholder偽元素修改其樣式，::placeholder偽元素代表元素的placeholder文字，用它可以修改placeholder文字的樣式。
placeholder偽元素不是標準的微元素：
::-webkit-input-placeholder
四、已提交作業
HTML零基礎入門
注意事項 1.doctype html 必須放在文件的第一行。2.doctype 宣告不是html標籤。當出現中文亂碼時，使用標籤來解決。3.影象標籤中 img src alt src必寫，它是屬於單閉合開關。標題標籤 h1 h6 段落標籤 p 換行標籤 br 單閉合開關 水平線標籤 hr 水平分割...
任務一 零基礎HTML編碼
面向人群 零基礎或初學者 難度 簡單 課程多數題目的解決方案都不是唯一的，這和我們在實際工作中的情況也是一致的。因此，我們的要求不僅僅是實現設計稿的效果，更是要多去思考不同的解決方案，評估不同方案的優劣，然後使用在該場景下最優雅的方式去實現。那些最終沒有被我們採納的方案，同樣也可以幫助我們學到很多知...
HTML零基礎學習筆記 一
size medium b html學習筆記 b size color darkred b 什麼是html?b color 超文字標記語言，即html hypertext markup language 是用於描述網頁文件的一種標記語言。color darkred b 什麼是w3c?b color ...