DHTML动态网页设计 作者 王愉 CSS课件III.pptVIP

3.1 列表 List 1. list-style-image 基本格式： list-style-image : none | url (url) 2. list-style-position 基本格式： list-style-position : outside | inside 3. list-style-type 基本格式： list-style-type : disc | circle | square | decimal | lower-roman | upper-roman | lower-alpha | upper-alpha | none 4. list-style 基本格式： list-style : list-style-image || list-style-position || list-style-type .style0{list-style: url(li_bg.jpg) inside;} .style1{list-style-type: square;list-style-image:none;} .style2{list-style-type: circle;list-style-image:none;} .style3{list-style-type: disc;list-style-image:none;} #style4 li{float:left;} #style4 li a{display:block; width:80; height:25; text-align:center; color: #000000; text-decoration:none; background-color:#EEFEAB; margin-left:1px; padding-top:4px} #style4 li a:hover{color:#ffffff; text-decoration:underline; background-color:#99cc00; 3.2 其他 滚动条 Scrollbars body{ scrollbar-face-color : #5AA0DA; scrollbar-highlight-color :#FFFFFF; scrollbar-shadow-color : #FFFFFF; scrollbar-3dlight-color : #5AA0DA; scrollbar-arrow-color : #FFFFFF; scrollbar-darkshadow-color : #000000; scrollbar-base-color : #FCFDFE;} 鼠标 cursor body { cursor: url(piano.ani); } 3.3 滤镜 IE支持 filter : filter 参数： filter : 要使用的滤镜效果。多个滤镜之间用空格隔开 Eg: div {filter:blur(strength=50) flipv() ; } 1. Alpha 滤镜 .effa{filter:alpha(Opacity=30)} img src=bean.gifclass=effa span style=filter:alpha(opacity=40);background:green;width:200px;margin:150 20 10 10 div style=position:relative;美丽的喀拉库勒湖/div span style=position:relative;湖光山色/span Lake, Jokul and Sky /span div style=filter:alpha(opacity=40);width:520px;margin:0 20 20 10 div style=position:relative;喀拉库勒湖海拔3600多米，湖面约10平方公里，因湖水深邃似墨，得名“墨湖”。/div 由两泓相连的湖泊组成，又称“姐妹湖”。 /div 2. Blur 滤镜 .effb{filter:blur(add=true,direction=90,strength=35)} img src=people.gif class=effb 3. FlipH, FlipV 滤镜 .effh{filter:fliph;width:120px;} img src=beat.gifclass=effh 4. Chroma 滤镜 .eff{filter:chroma(color=white)} img src=flower.gifclass=eff 5. DropShado