1.CSS定位

通過css定位可以實現頁面元素的指定效果顯示。它允許你定義元素框相對於其正常
位置應該出現的位置，或者相對於父元素、另一個元素甚至瀏覽器視窗本身的位置。

position 定位屬性：
隨意擺放元素 而使其不影響其他元素位置，以拖拽元素作為例項

static：  元素按照普通方式生成，按照HTML規定過的規則進行定位。 
relative：元素框偏移某個距離。元素仍保持其未定位前的形狀，原本所佔的空間仍保留。
absolute：元素框從頁面元素中被獨立出來，使用邊偏移來定位。
fixed：元素框將從頁面元素中獨立出來，但位置不是相對於文件本身，而是相對於螢幕。

邊偏移

定義元素相對其父元素邊線的距離
position：absolute;
top/right/bottom/left:10px;
top/right/bottom/left:auto;
top/right/bottom/left:20%;

連結樣式

a: link { text-decoration:none; }   控制連結未訪問狀態
a: hover { text-decoration:none; }  控制滑鼠懸停狀態
a: active { text-decoration:none; } 控制連結啟用狀態
a: visited { text-decoration:none; }控制連結已被訪問狀態
 

透明

/*相容火狐谷歌等瀏覽器*/
opacity() 
/*ie*/
filter:alpha(opacity=90) ;   0-100
filter:opacity(50%) 支援百分比

2.  background: rgba(0,0,0,.75);      0-1

陰影

box-shadow:新增一個或多個陰影
text-shadow:為文字新增陰影

補充

p:first-child{}   選擇所處在子元素的第一個p---------相容所有
p:last-child{}    選擇所處在子元素的最後個p------不相容ie678
border-radius 切圓
a
 
[ href ]  屬性選擇器
div a      派生選擇器（後代選擇器）
placeholder  輸入框提示
:after   在……之後插入文字內容
:before 在……之前插入文字內容
map>area 圖片熱區（可點選區域影象對映）------------目前淘寶使用居多-dreamweaver可選擇區域
coords    座標值
shape     定義區域形狀：rect矩形(x1,y1,x2,y2)   
          circle圓形(x,,y,R)
          poly( x1,y1,x2,y2,x3,y3…… )多邊形

target：
_blank 新的標籤頁開啟

居中：text-align:center;

2.CSS浮動

浮動：
float:auto/left/right;
讓元素浮動起來脫離正常流來進行向左或向右移動，直到父級的邊緣或浮動元素的邊緣
浮動之後會導致一個問題，飄離出去的元素父級的高會被彈回去而且文字會圍繞著這個浮動元素

清除浮動:  clear：{ both }

position定位：

相對定位：relative
        生成一個相對的定位元素，（自己不移動沒任何效果，會影響子元素的定位效果）
        1. 以自身進行移動（移動前的位置就是原始位置） 
        2. 佔據原來的空間（雖然參考自己原來的位置移動了，但是佔據的位置始終沒有變化）

絕對定位：absolute
    以相對於某個元素進行絕對定位（fixed是相對於視窗，與之很像）
    1. 參考定位父級元素進行移動（當最近父級用了除static之外的定位） 
    2. 不佔據空間

    因為脫離文件流，移動難免與別的元素髮生重疊，可以用Z-Index來控制
    它的層級次序值越高所顯示在最上面

    定位父級：
    除static之外的定位元素， 子元素都會相對於父元素進行定位當沒有父級
    使用定位的時候，會以 [瀏覽器] 的邊緣來做相對定位

fixed固定

position：fixed； 
會以瀏覽器視窗來定位，即使頁面滾動，也會保持原來的位置，設定上下左右 
四個屬性會使其偏離其正常位置，其他的元素的位置則不會受該元素的影響發
生位置改變來彌補它偏離後剩下的空隙。

z-index層級順序

當有很多元素都被定位重疊或遮住而需要給它展現出來的時候
z-index就可以做出調整（調整層級關係）
可以接受負數,值最大的會展示在表面(當相同的時候會被後面的元素覆蓋)

ps：z-index 只允許調整使用了定位的元素