css學習筆記
1、標準文件流、塊級元素、行級元素
2、盒子模型
邊框（border）
盒子中內容（content）
內邊距（padding）
外邊距（margin）
注：設定時按照上右下左順序，從頂部開始沿順時針方向設定
設定有三個屬性值時代表上（左右）下
設定有兩個屬性值時代表（上下）（左右）
設定有乙個屬性值時代表四個屬性值設定均相同
屬性值與屬性值之間使用空格隔開
盒子模型立體來看，可分為五層，依次為：border、content+padding、background-image、background-color、margin
3、自動居中一列布局：
水平居中：margin:0 auto;
auto：左右值設為auto，可以理解為根據瀏覽器的寬度自動設定兩邊的外邊距，在不同瀏覽器下均使其居中，且使用auto時不能再設定浮動或絕對定位屬性（注意：使用margin時width值也要設定成乙個定值）。
4、浮動布局二列布局：
左浮動：float:left;
右浮動：float:right;
不浮動：none
（float屬性塊如果未指定寬度，它的大小會隨著內容的多少而發生改變，如果沒有內容且沒有指定寬度，該塊會縮成乙個點而導致看不見）
注： 如果想要使這個二列布局固定寬度水平居中，則可指定乙個大的塊作為父級，將這個二列布局包含在內，然後指定寬度，再使其居中即margin:0 auto;
當設定float屬性時，會對緊鄰其後的元素產生影響而使布局改變，所以要對受到浮動影響的元素設定清除浮動屬性：
clear:both;
或 為元素同時設定：width:100%（或固定寬度）;overflow:hidden;
5、position屬性：
position屬性可設定四個屬性值：
static（靜態定位）
relative（相對定位）：相對與自身原有位置進行偏移
fixed（固定定位）
absulote（絕對定位，脫離了標準文件流）
左：width:leftwidthpx;position：absulote;
中：margin:0 rightwidthpx 0 leftwidth;
右：width:rightwidthpx;position：absulote;
（未設定寬度時塊的大小按照內容的大小決斷，偏移量的偏移參照標準為：無已定位祖先元素：以為偏移參照基準；有已定位祖先元素：以距其最近的已定位的祖先元素為偏移參照基準）
注： 此設定可使左右固定寬度，中間自適應，如果想使中間塊在左右留有空隙，可以設定rightwidthpx與leftwidthpx大一些。
6、使用absulote實現橫向兩列布局舉例**（父元素相對定位，自適應寬度元素絕對定位）：
type="text/css">
body
.top
.main
.left
.right
.foot
style>
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 元素內部 擁有最...