一、塊元素：
特點：1、預設顯示在頁面的左上角，內容也是預設在左上角
2、預設單獨佔滿一行（佔滿整個文件流）
常用的塊級元素：
p、h1-h6、ul li、ol li、div、hr、table、
二、行內元素（內聯元素）：
特點：1、大小受到文字區域的影響，height、width在行內元素中不起作用
2、行內元素不會單獨佔滿一行
常用的行內元素：
a、span、img、input
三、塊級元素與行內元素的相互轉換
1、display:inline; 塊級轉成行內元素
2、display:block; 行內元素轉成塊級元素
3、display:inline-block; 具有行內元素和塊級元素特點:
（1）width、height會受到影響
（2）不會單獨佔滿一行
四、浮動（float)
1、float: left right
2、清除浮動：clear:lift、right、both (清除兩邊的浮動)
注意要點：塊與塊之間，浮動的影響，可以用clear來清除
例項：
<效果：html
>
<
head
>
<
title
>float 浮動
title
>
<
style
type
="text/css"
>
#d1,#d2
#d3#d4
style
>
head
>
<
body
>
<
div
id="d1"
>浮動1
div>
<
div
id="d2"
>浮動2
div>
<
div
id="d3"
>浮動3
div>
<
div
id="d4"
>浮動4
div>
body
>
html
>
通過運用 float 塊元素的浮動
用clear 清除塊元素浮動之間的影響，從而實現塊與塊併排。
五、盒子模型
要點：如何做布局？邊框、內間距、外間距，需要掌握好，就像拼圖。
1）、邊框樣式的覆蓋
例：
#d12）、內間距
要點：撐開
padding
padding:10px; 上下左右撐開10px
padding:10px 20px; 上下、左右
padding:10px 10px 20px; 上、左右、下
padding:10px 15px 20px 25px; 上、右、下、左
例：
<效果：html
>
<
head
>
<
title
>padding 特點
title
>
<
style
type
="text/css"
>
#d1style
>
head
>
<
body
>
<
div
id="d1"
>特點
div>
body
>
html
>
如果這時想設定邊框高度和寬度為100px的話,**如下：
<效果：html
>
<
head
>
<
title
>padding 特點
title
>
<
style
type
="text/css"
>
#d1style
>
head
>
<
body
>
<
div
id="d1"
>特點
div>
body
>
html
>
要注意更改後的邊框，是從下方和右減少。
3）、外邊距
margin
要點：外邊距指的是塊與外面的邊距，
一圖看懂內、外邊距
留意：padding 對行內元素是支援的，margin只支援左右，不支援上下。
六、定位 （絕對定位與相對定位）
1、絕對定位：position:adsolute;
1）、當設定為絕對定位之後，將脫離文件流，不會佔滿一行，並且不會受到float的影響。
2）、當設定為絕對定位的時候，元素的方位就受到窗體的top,left,right,bottom的影響。
技巧：元素設定為絕對定位後，可通過top,left,right,bottom來控制元素在窗體中的方位。
2、相對定位：position:relative;
1）、當設定為相對定位時，元素沒有脫離文件流。float可以對其影響。
2）、當設定為相對定位時，方位top,left,right,bottom是相對於元素的父元素，由於標籤並沒有脫離文件流，所以它四周的標籤是佔著位置的。
絕對定位與相對定位的區別：乙個是脫離文件流，乙個是沒有脫離文件流。
3、固定定位：position:fixed;
1）、通過top,left,right,bottom來控制元素在窗體中的固定的方位
2）、脫離文件流，不受float的影響。
css第四課時
1 特殊選擇器 用於匹配任何標籤 用於指定父子節點的關係 測試測試測試 e f毗鄰選擇器，匹配e緊隨e元素之後的同級元素f e f匹配e之後的同級元素f 2 a title 表示為設定了title屬性的a元素設定樣式 a title 表示為設定了title屬性的某個屬性值的a元素設定樣式 a hre...
鋼琴第四課
因為此前每天都練琴，曲譜也都記住了，所以，週六，臨時被老師喊去時，非常自信。學到了很多知識。1.連貫性方面 連貫性要注意 其實，連貫性在於對曲目的熟練程度，手指的靈活程度，還有不同音之間的連貫跳躍 音要連續 不同音，要連續連線在一起 這個音落下，上個音才起來 2.節奏方面 四分音符要短快，彈到了，立...
Linux每日小知識（第四課）
旨在為linux學者提供些許幫助 此篇前半部為上篇的續部 vi 編輯器 命令 英文功能 y 複製命令 copy 複製yy copy 複製一行,可以nyy複製多行 d 剪下命令 delete 剪下dd 剪下 delete 剪下一行,可以 ndd 剪下n行 ppaste貼上 注意 命令英文 功能工作模式...