<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>第一题（爱奇艺）</title>
<style>
*{ /*清除元素的默认内、外边距*/
margin: 0;
padding: 0;
}
h3{
font-size: 18px;/*标题的文字大小设置为18px，行高为40px*/
line-height: 40px;
}
.no1{
width: 1000px;/*页面宽度为1000px，水平居中显示*/
margin:0 auto;
}
li{
list-style: none;
padding: 10px;
margin-right: 5px;/*li列表项内边距为10px，外右边距为5px*/
}
img{
border-radius:10px ;/*给图片添加圆角效果*/
}
.no2{
display: inline-block;
}
p:nth-of-type(1){
color:#4d4d4d;
}
p:nth-of-type(2){
font-size: 14px;
color:#640000;
}
p:nth-of-type(3){
font-size: 12px;
color:blue;
}
li:hover{
border-radius:10px ;
box-shadow: 5px 2px 0.2px lightsteelblue,0px 0px 0.1px lightsteelblue;
}
</style>
</head>
<body>
<div class="no1">
<h3>热播</h3>
<div class="no2">
<ul>
<li><img src="img/img1.png"/>
<p>武神赵子龙</p>
<p>怒，林更新不抱网红抱女神</p>
<p>点击次数：242445次</p>
</li>
</ul>
</div>
<div class="no2">
<ul>
<li><img src="img/img2.png"/>
<p>旋风十一人</p>
<p>胡歌变教练在撩前女友</p>
<p>点击次数：242445次</p>
</li>
</ul>
</div>
<div class="no2">
<ul>
<li><img src="img/img3.png"/>
<p>太阳的后裔</p>
<p>宋慧乔吃嫩草</p>
<p>点击次数：242445次</p>
</li>
</ul>
</div>
<div class="no2">
<ul>
<li><img src="img/img4.png"/>
<p>山海经之赤影传说</p>
<p></p>娜扎张翰再度联手</p>
<p>点击次数：242445次</p>
</li>
</ul>
</div>
</div>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>登入</title>
<link rel="stylesheet" type="text/css" href="css/登入头尾.css"/>
<style>
.no3{
width:342px;
border: 1px #000000 solid;
float: right;
}
.no2 .no3{
display: inline-block;
}
.biankuang1{
border: 1px solid #000000;
width:900px;
float: left;
margin-left: 25%;
}
</style>
</head>
<body>
<header>
<div class="no1">
<ul>
<li><img src="img/logo.png"</li>
<li class="no1-1"><a href="蔚蓝网购物首页.html">首页</a></li>
<li>|</li>
<li><a href="#">商品展示页面</a></li>
<li>|</li>
<li><a href="蔚蓝网购购物车.html">购物车</a></li>
<li>|</li>
<li><a href="注册.html">注册</a></li>
</ul>
</div>
</header>
<section>
<div class="biankuang1">
<div class="no2"><img src="img/book.jpg"</div>
<div class="no3">
<ul>
<li>请登入蔚蓝网</li>
<hr />
<li>Email地址或昵称：<input type="text"/></li>
<li>密码：<input type="password"/></li>
<button>登录</button>
<p><span>还不是蔚蓝网用户？</span> 快捷方便的免费注册，让你立刻尽享蔚蓝网提供的条项优惠服务...... </p>
<button>快速注册用户</button>
</ul>
</div>
</div>
</section>
<footer>
<div class="bottom1">
<ul class="bottom1-1">
<li><a href="#">正版保障</a></li>
<li>|</li>
<li><a href="#">满额免运</a></li>
<li>|</li>
<li><a href="#">货到付款</a></li>
<li>|</li>
<li><a href="#">品种最全</a></li>
<li>|</li>
<li><a href="#">免费退换</a></li>
</ul>
</div>
<div class="bottom2">
<ul class="bottom2-1">
<li>Copyright (C) 蔚蓝网 2006-2016, All Rights Reserved </li>
<li><img src="img/validate.gif"/><span>京ICP证100488号 出版物经营许可证 京批100160号</span></li>
</ul>
</div>
</footer>
</body>
</html>
扫一扫
5930
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
