Practical Training Demo1-底部页脚(10.28)
作者:互联网
哇塞塞,不知这样写的形式可不可用,但是写出来了呢;哈哈哈,还挺开心的,虽然有待提高,但鼓励鼓励自己趴。留个纪念。哈哈哈...得瑟小张
HTML内容部分:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <link rel="stylesheet" type="text/css" href="css/foot.css"/> </head> <body> <!-- div.foot>ul>li>a[href=#]{关于我们}*5 --> <div class="foot"> <div class="foot1"> <ul> <li> <a href="#">关于我们</a> <a href="#">人才招聘</a> <a href="#">联系我们</a> <a href="#">友情链接</a> <a href="#">版权声明</a> <a href="#">客服中心</a> </li> </ul> </div> <!-- div.foot2>ul>li>span*3 --> <div class="foot2"> <ul> <li> <img src="img/culture.png" > <span>Copyright © 2009-2016 yinyuetai.com 广播电视节目制作经营 许可证编号(京)字第1891号 </span> <span>京网文[2014]2037-287号</span> <span class="color">网络视听许可证0110413号</span> </li> </ul> </div> <div class="foot3"> <ul> <li> <!-- <img src="" alt=""> --> <span>京公网安备1101052014900号</span> <span>京ICP备11024134号-1</span> <span>京ICP证060716号</span> <span>出版物经营许可证 新出发京零字第朝130062号</span> <span class="ss2">增值电信业务经营许可证B2-20140501</span> <img class="img" src="img/biaoshi.gif" > </li> </ul> </div> <div class="foot4"> <ul> <li>食品经营许可s证:JY111050485336</li> <li>营业执照</li> </ul> </div> </div> </body> </html>
CSS内容部分:
*{ margin: 0px; padding: 0px; } .foot{ width: 1300px; text-align: center; background-color: #111; /* background-color: #DE4767; */ height: 200px; } .foot ul li{ display: inline-block; } .foot .foot1{ /* padding-right: 10px; */ } .foot .foot1 ul li{ margin-top: 40px; text-align: center; /* margin: 10px 30px; */ } .foot .foot1 a{ text-decoration: none; color: #666666; border-right: 2px dotted #FFFFFF; padding-right: 20px; margin-left: 10px; font-size: 14px; } /* 最后一个隐去 */ .foot .foot1 a:last-child{ border-right: none; } /* 第二部分 */ .foot .foot2{ margin-top: 40px; } .foot .foot2{ vertical-align: baseline; } .foot .foot2 img{ width: 25px; height: 25px; margin-right: -5px; margin-bottom: -5px; } .foot .foot2 span{ color: #CCCCCC; font-size: 12px; border-right: 1px solid #CCCCCC; padding-right: 5px; margin-left: 5px; /* margin-bottom: -10px; */ } .foot .foot2 .color{ border-right: none; color: lightseagreen; } .foot .foot3 li{ margin-top: -40px; margin-left: 20px; } .foot .foot3 span{ color: #CCCCCC; font-size: 12px; border-right: 1px solid #CCCCCC; padding-right: 5px; /* margin-left: 5px; */ } .foot .foot3 span:last-child{ border-right: none; } .foot .foot3 .img{ width: 40px; height: 45px; margin-left: -10px; } .foot .foot3 .ss2{ border-right: none; } .foot .foot4 li{ color: #CCCCCC; font-size: 12px; border-right: 1px solid #CCCCCC; padding-right: 5px; margin-left: 5px; } .foot .foot4 li:last-child{ border-right: none; }
标签:Training,right,页脚,10.28,border,color,5px,foot,margin 来源: https://www.cnblogs.com/zky1012/p/15477064.html