达乐居视频网前台页面的总结
这几天在公司做静态页面,因为之前从来没有自己单独用div+css完成页面,趁着这个平台总结一下,以免遗忘。
第一天做页面因为不懂div的浮动所以一上午都是在捉摸不定,下午改用table做页面,虽然能很快的做好,但是好像不利于推广
周末回宿舍看会儿Dreamweaver然后周一上班显然比第一天好很多,用了6个小时做完一个页面虽然现在看还是觉得不美观,但还是学到了很多
1.div层叠、透明
1 <div class="f2"><img src="img2/f2.png" class="f2"/></div> 2 <div class="blk">123</div> 3 <div class="text" >郑州七旬老人住坟场 拒救助</div>
.f2 { z-index:1; width:481px; height:241px; position:relative; } .blk { margin-top:-20px; background-image:url(../img2/black1.png); z-index:2; width:481px; alpha(opacity=50); /*支持 IE 浏览器*/ -moz-opacity:0.50; /*支持 FireFox 浏览器*/ opacity:0.50; /*支持 Chrome, Opera, Safari 等浏览器*/ position:absolute; } .text { z-index:3; color:#FFF; margin-top:-18px; position:absolute; }
2.li中的设置
.ul1 { list-style-type:none; margin:0; padding:0; } .ul1 li { background: no-repeat url(../img2/icon3.png) 5px; line-height: 25px; padding-left: 15px; list-style-type:none; } .ul1 li a{ color:#000000;} .ul1 li a:hover{ color:#FF0000;}