css：(cascading style sheets) 層疊樣式表，多個樣式層層疊加
作用：修飾html頁面，更豐富地展示超文字資訊(文字內容，外形，版面布局)
html屬性單獨使用有一定侷限性，配合css樣式使用可以展示更豐富效果
每個html標籤都有個style屬性，用於設定css樣式
選擇器指定css樣式作用域什麼html標籤
格式：選擇器名稱
>
span
style
>
可作用於頁面內所有span標籤
>
span
style
>
可用於相同標籤需要使用不同樣式，對於如下標籤，要設定span和div標籤內容體為紅色，給標籤的屬性定義class
>
class
="redc"
>
redspan
>
class
="redc"
>
reddiv
>
body
>
>
.redc
style
>
>
"s1"
>
blackspan
>
body
>
>
#s1style
>
標籤之間具有層級關係，如body為html的子標籤
可以對基本組合器進行組合，表現層級關係，更具有針對性地把樣式作用於某些標籤
使用情況：當需要作用的標籤為某標籤的子標籤，為了不影響其他無需更改的標籤
只改變div下的font標籤內容體
>
>
>
get redfont
>
div>
>
get blackfont
>
body
>
>
div font
style
>
注：區分後兩種，是否是元素在選擇器內，或是選擇器為其的元素
邊框屬性html預設所有標籤都有邊框，預設不可見
屬性：
樣式border可設定線條寬度，樣式，顏色
樣式有：實線solid，雙線double，無邊none
>
font
style
>
**格式為#和六位十六進製制數，每兩位表示紅r，綠g，藍b的顏色深度
如#ff1100為紅色，#ff0011ff為藍色，設定不同的值可以調整出更豐富的顏色
布局
浮動float，通常預設排版格式，用於將頁面元素按一定順序排列
注：設定浮動後元素會按照設定順序一一排列，如按順序擠到右側
而浮動會使元素脫離當前頁面，即原有內容可能被遮擋，所以頁面需要重新調整
屬性值可設定 向左left，向右right，預設不浮動none
>
font
style
>
如：標題h1，段落p，塊div，列表ul，ol
行內元素：根據內容的多少占用行內空間，不會自動換行
如：塊span，超連結a，img，列表專案li
標籤的display屬性可以試標籤在塊級和行內間呼喚
屬性值：塊級元素block，行內元素inline，隱藏不顯示none
>
span
diva
style
>
>
span
style
>
所有html元素都可看成乙個四邊形，可看作乙個盒子
設定盒子的邊框border，內邊距padding，外邊距margin樣式的方式，稱為盒子模型，都為style的屬性
內邊距：元素內容體與盒子上下左右的距離
外邊距：元素之間上下左右的距離
可分別設定上下左右：***-top，***-bottom，***-left，***-right
也可直接設定***
可設定邊框粗細，樣式和顏色（同css樣式的邊框屬性）
>
span
divstyle
>
行內樣式通過標籤的style屬性來設定元素樣式
>
style="
fontsize
: 2px;
color
: red;
">
111font
>
body
>
style標籤在head內設定style標籤，可同時設定多個標籤
>
font
style
>
需要建立css檔案，在檔案中寫入需要的樣式
span
在html中的head標籤內新增鏈入式link標籤，屬性：
>
rel=
"stylesheet"
type
="text/css"
href
="1.css"
>
head
>
CSS學習 CSS學習筆記
出處 注 本學習筆記只是自己的一些備忘，初學者的東西不具有參考性，請到w3school 進行系統學習。學習css我使用的工具是visual css，可以實現同步預覽，快速學習編輯css。1.css的作用 用來規定網頁中的內容的顯示方式，避免給html增加很多的屬性而將 變得臃腫。2.css的應用方式...
CSS學習 CSS學習筆記
出處 注 本學習筆記只是自己的一些備忘，初學者的東西不具有參考性，請到w3school 進行系統學習。學習css我使用的工具是visual css，可以實現同步預覽，快速學習編輯css。1.css的作用 用來規定網頁中的內容的顯示方式，避免給html增加很多的屬性而將 變得臃腫。2.css的應用方式...
CSS 學習筆記
當同乙個html元素被不止乙個樣式定義時，會使用哪個樣式呢？一般而言，所有的樣式會根據下面的規則層疊於乙個新的虛擬樣式表中，其中數字4 擁有最高的優先權。1.瀏覽器預設設定 2.外部樣式表 3.內部樣式表 位於標籤內部 4.內聯樣式 在html 元素內部 因此，內聯樣式 在html 元素內部 擁有最...