computer class 6 guoyixuan
css是級聯樣式表（cascading style sheets)的縮寫。html用於撰寫頁面的內容，而css決定這些內容如何在頁面上呈現。
一條css樣式規則由兩個重要的部分組成:選擇器，以{}包裹的一條或多條宣告。
用#加上id，這就是id選擇器。
任何元素都可以歸屬於自己定義的乙個class，以方便統一管理.用.加上class名表示以空格作為分隔，如:.haha p代表在屬於haha類的元素內中所有元素
子選擇器可以說是要求更高的後代選擇器
子選擇器所選擇的是直接後代，如:.haha>p代表屬於haha類的元素內中所有元素，且最靠近最接近它的一層（巢狀）的元素屬於haha類，也就是說，他們之間不能隔其它元素。
外部樣式表就是建立乙個css檔案，裡面寫有需要的樣式語句，只需要引入樣式表即可
在裡面引入css檔案，如
相似的，可以把樣式語句放在裡面而不是放在css檔案引入,這被稱為內部樣式表。 內聯樣式 內聯樣式，就是和元素連線的很緊密，也就是直接把樣式規則直接寫到要應用的元素中。
如:內聯樣式》內部樣式表或外部樣式表》瀏覽器預設樣式
如圖，由外至內依次是，外邊框(margin),邊框(border),內邊距(padding),內容(content)
說明
margin外邊框:邊框以外與其它元素的區域
border邊框:預設不顯示
padding填充:也叫內邊距，即內容和邊框之間的距離
content內容:盒子的內容，如文字等
對於元素中的文字，我們可以簡單設定text-align屬性為left,center,right即可（預設的是左對齊）
邊框
border：1px dotted black;上下左右都相同
border:1px solid blue;只設定底部邊框
border-radius:15px;圓角
border-left:5px solid purple;只設定左部
邊距
padding：20px;上下左右都相同
padding-top:20px;只設定底部
padding-right:20px;只設定右邊
padding:10px 20px 30px 40px；依次是上右下左(也就是順時針方向)
padding:10px 20px；上下是10px，左右是20px
位置(position)，設定了元素的position屬性後才能使用top，bottom，left，right屬性，否則定位無效。
那麼，有哪些position屬性呢？
static
靜態定位(static)：這是元素預設的定位方式，無論你設定與否，元素都將按正常的頁面布局進行。即:元素按照在html出現的先後順序從上到下，從左到右進行元素的安排。
relative
相對定位(relative)：把元素相對於它靜態的位置進行偏移
如:.example-relative
這段**將屬於這個類的所有元素移動到了距離原來的頂部40px，距離原來的左部60px的位置.fixed
固定定位(fixed):這使得元素固定不動(即使你上下左右拖動瀏覽器的滾動條)
此時元素的位置仍然由top，bottom，left，right屬性固定，但相對的是視口（view），即螢幕可見區域
absolute
絕對定位(absolute)：設定了絕對定位的元素會相對於其最近設定了定位屬性(非static)的父元素進行偏移，如果改元素的所有父元素都沒設定位置屬性，那麼就相對於這個父元素
當元素內容超過其指定的區域時，我們通過溢位overflow屬性來處理這些溢位的部分。 溢位屬性有一下幾個值：
在乙個區域或容器內，我們可以設定float屬性讓某元素水平方向上向左或右進行移動，其周圍的元素也會重新排列。我們常用這種樣式來使影象和文字進行合理布局
我們可以用 height 和 width 設定元素內容佔據的尺寸。常見的尺寸單位有：像數 px，百分比 %等。
我們可以採用顏色名稱也可以使用顏色rgb16進製制值，來設定前景或背景的顏色。
如:我們可以用opacity對任何元素（不過常用於）設定不透明度。值在[0.0～1.0]之間，值越低，透明度越高
從右往左依次是opacity;1.0 0.8 0.6,但是這裡csdn上顯示有問題
偽類的語法:在選擇器後使用:號，再跟上某個偽類或偽元素
a:link /* 未訪問的鏈結 */
a:visited /* 已訪問的鏈結 */
a:hover /* 滑鼠劃過鏈結 */
/* 滑鼠移到段落則改變背景顏色 */
p:hover
p:first-line /* 段落的第一行顯示藍色 */
p:first-letter /* 段落的第乙個字超大 */
h1:before /* 在每個一級標題前插入該 */
h1:after /* 在每個一級標題後插入該 */
月亮公升起來了
太陽落下了
本沒有什麼因果
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 元素內部 擁有最...