1. 程式人生 > >css基礎:格式與布局

css基礎:格式與布局

避免 漸變 邊框 最小寬度 tran hidden wid 布局 鼠標

1.定位:position:fixed;鎖定位置,相當於屏幕位置鎖定,不隨頁面移動。

position:absolute;絕對位置,相對於頁面定位,隨頁面移動。

position:relative;相對位置,相對於頁面內周邊元素的位置,要註意與周圍元素的關系,避免相互排擠。

2.其他屬性:z-index:n;該層設置為第n層,三維布局,在z軸方向分層,可理解為摞紙。

float:left;橫向左側排列,橫向流式布局,超出邊框後自動排在下一行;right 橫向右側排列。

overflow:hidden;超出部分隱藏;scroll 顯示出滾動條。

min-width:4px;最小寬度。

border-radius:5px;邊框圓角,可填像素或百分比。

box-shadow:5px 5px 5px black;邊框陰影:向右 向下 虛化5px 黑色。

text-shadow:5px 5px 5px black;文字陰影:向右 向下 虛化5px 黑色。

transition:0.5s;漸變效果,變化時間為0.5s。

transform:rotate(360deg);旋轉360度。

margin-left:10px;向右平移10px。

opacity:0.5;半透明效果,50%透明效果

a:hover {color:red;鼠標指向鏈接時顏色變為紅色;cursor:pointer;鼠標指到上面時的形狀;}

css基礎:格式與布局