通用類
overflow:hidden;自動(dòng)隱藏超出的內(nèi)容，防止撐開(kāi)層和表格的范圍
!important
指定樣式規(guī)則的應(yīng)用優(yōu)先權(quán)
文字類 color: #FF0000;文字顏色 font-family: "Arial", "Helvetica", "sans-serif";字體 font-size: 9px;字號(hào) text-align：center; 居中(left為居左,right為居右) line-height：28px；行高(可用150%值) font-style: italic;斜體(oblique偏斜體) font-weight: bold;服務(wù)粗體(bolder特粗，400粗值) font-variant: small-caps;小型大寫字母 text-transform: capitalize;首字母大寫 text-decoration: underline overline line-through blink;下劃線，上劃線，刪除線，閃爍 text-indent: 2em;文字縮進(jìn)2個(gè)字體高(或15px,即15象素)
　　背景類 background-attachment: fixed;固定位置(scroll滾動(dòng)) background: #0066CC;背景色(transparent透明) background: url(/image/more2.gif);背景圖片 background-repeat: repeat;重復(fù)(repeat-x橫向重復(fù)，repeat-y縱向重復(fù)) background-position: center top;水平居中 垂直頂部(left center水平居左 垂直居中) background：url(/image/dtbg.gif) #FEFEFE
　　no-repeat
　　right bottom(2px 5px);
　　背景圖片、
　　背景顏色、圖片不重復(fù)、背景圖片從右下角開(kāi)始(圖片距左2px距上5px)
　　框架位置類
　　clear: both;兩邊拒排浮動(dòng)對(duì)象(left左邊拒排浮動(dòng)對(duì)象,right右邊拒排浮動(dòng)對(duì)象)
　　float: left;浮動(dòng)對(duì)象位置居左(right, 最新列車時(shí)刻表位置居右)
　　position：relative; 相對(duì)位置，一般在上級(jí)框架中設(shè)定 極品時(shí)刻表
　　position：absolute; 絕對(duì)位置，配合上級(jí)框架的設(shè)定對(duì)本級(jí)框架設(shè)定，設(shè)置top、left值
　　top：5px; 頁(yè)面絕對(duì)或相對(duì)于框架頂端絕對(duì)位置
　　left：10px; 頁(yè)面絕對(duì)或相對(duì)于框架左邊絕對(duì)位置
　　width: 100px;寬100px
　　height: 200px;高200px(可用auto和100%值)
　　margin 上?；疖嚂r(shí)刻表：10px 20px 10px 20px；
　　上右下左頁(yè)邊距(值相同可省寫margin:10px)
　　單獨(dú)指定用margin-top：10px; (margin-right、margin-bottom、margin-left)
　　padding：20px 10px 10px 20p；
　　上右下左內(nèi)容離邊框的距離(值相同可省寫padding:10px)
　　單獨(dú)指定用padding-top：10px;(padding-right、padding-bottompadding-left)
　　border：#ccc 1px solid 成都列車時(shí)刻表；
　　四邊框顏色、線寬、實(shí)線(dotted虛線,dashed點(diǎn)畫線,double雙線,ridge脊線)
　　單獨(dú)指定用border-top：#ccc 1px solid；border-right：#ccc 1px solid
　　等等
　　項(xiàng)目列表類 list-style-position: outside;位置為外(inside內(nèi)) list-style-image: url(/yh/image/more04.gif);項(xiàng)目符號(hào)圖像 臨客時(shí)刻表 list-style-type: disc;項(xiàng)目符號(hào)為圓點(diǎn)(circle圓圈,square方塊)
　　擴(kuò)展類 cursor: e-resize;鼠標(biāo)樣式 filter: Blur(Add=4, Direction=8, Strength=4);濾鏡 filter: FlipH;橫向翻轉(zhuǎn)(FlipV gprs流量費(fèi)縱向翻轉(zhuǎn))
　　單獨(dú)設(shè)置鏈接
　　#bottool a:link{color:#fff};未訪問(wèn)的顏色
　　#bottool a:visited{color:#fff};已訪問(wèn)的顏色 流量軟件
　#bottool a:hover{color:#ff0};鼠標(biāo)在鏈接上
　　這么多定義項(xiàng), 其實(shí)常用也就下面幾類:指定寬高值width,height;指定背景:background;指定位置:float,特殊的用position結(jié)合 top、left來(lái)定位；設(shè)定框架邊距：margin；設(shè)定容器內(nèi)框距：padding幾項(xiàng)。其中在我的樣式定義中取消了overflow、 clear、!important程序的定義項(xiàng)。1、取消overflow:hidden是因?yàn)榻?jīng)反復(fù)實(shí)驗(yàn)，該定義項(xiàng)只能隱藏超出容器高度的內(nèi)容而不能隱藏超出寬度的內(nèi)容。而我需要的就是要能自動(dòng)隱藏超出容器寬度的內(nèi)容，有時(shí)反而需要容器高度能隨內(nèi)容的多少而撐開(kāi)容器高度。2、取消clear定義項(xiàng)是因?yàn)樵趯?shí)際應(yīng)用中很真正達(dá)到理解的容器與容器的排列關(guān)系，框架或容器的位置還是用float、position、top、left等精確定位。 3、!important
　　指定樣式規(guī)則的應(yīng)用優(yōu)先權(quán)。這個(gè)主要用于在IE和其它的瀏覽器要區(qū)別顯示出的效果，我的網(wǎng)站就是想固定顯示效果，所以不存在什么優(yōu)先權(quán)。
　　我對(duì)DIV+CSS也還在研究之中，有不當(dāng)之處請(qǐng)大家跟貼指正，有完善的地方也請(qǐng)跟貼完善。我認(rèn)為用DIV+CSS來(lái)布局網(wǎng)站，最重要的是布局思路問(wèn)題，不同的設(shè)計(jì)方案，設(shè)計(jì)的繁簡(jiǎn)大不一樣。我著重框架或容器的通用性，設(shè)計(jì)出幾種容器的樣式，就象FS4中的標(biāo)簽樣式，然后在需要的地方調(diào)用這個(gè)樣式就行了，以達(dá)到通用性而不是專用性。今天就談這些，以后再專門談?wù)勥@個(gè)布局設(shè)計(jì)思路問(wèn)題。

最新評(píng)論