2017.11.7作业

来源：互联网发布：网络专供款烟机编辑：程序博客网时间：2024/06/07 19:21
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>欢迎光临Coding Coffee</title><style type="text/css">.navigator ul{list-style-type:none;margin:0;padding:0;background-color:#333;}.navigator li a{text-decoration:none;display:block;padding:15px 18px;color:#ffffff;}.navigator li{float:left;}.navigator li:hover{background-color:#ccc;}.navigator .userpic{width:35px;height:35px;border-radius:50px;border:2px solid #eee;}.navigator .pic{float:right;position:relative;top:4px;right:15px;}.sidebar{background-color:#333;position:fixed;width:150px;top:0;right:-150px;bottom:0;padding:20px 0;}.sidebar ul{margin:0;padding:0;list-style:none;}.sidebar ul a{color:#ffffff;text-decoration:none;padding:10px 30px;display:inline-block;width:100%;}.sidebar ul a:hover{background-color:#444444;}.mask{display:none;position:fixed;top:0;bottom:0;left:0;right:0;background-color:rgba(0,0,0,0.3);}.wraper{text-align:center;}.wraper p{display: inline-block;font-weight:bold;}</style></head><body><div class="navigator"><ul><li><a href="list.html">产品列表</a></li><li><a href="shoplist.html">分店列表</a></li><li><a href="joinUs.html">加入我们</a></li><li><a href="onlineOrder.html">网上订购</a></li><li class="pic"><img class="userpic" src="./img/c2.jpg" alt=""></li><div style="clear:both;"></ul></div><div class="wraper"><h1 style="color:blue;">欢迎光临Coding Coffee</h1><img src="./img/c9.jpg"><div><p>敬请关注我们定期的<a href="list.html">产品列表</a>Coding Coffee是一家只对程序员开放发互联网咖啡馆。</p></div><div><p>请查看我们的<a href="shoplist.html">分店列表！</a></p></div><div><p>如果你想<a href="joinUs.html">加入我们</a>，请查看我们的招聘列表。</p></div><div><p><a href="onlineOrder.html">网上订购</a>Coding Coffee天天赢大礼。</p></div></div><div class="mask"></div><div class="sidebar"><ul><li><a href="#">关于我</a></li><li><a href="#">想约我吗</a></li><li><a href="#">包养我</a></li><li><a href="#">与君共勉</a></li><li><a href="#">。。。</a></li></ul></div></body></html>
阅读全文
0 0