哪位大师能写下这样的页面的一个html源代码，感激不尽，必有重谢！！
本人在做一个基于javaweb的晚上书店，代码部分别的都还好就是苦于不会写页面html和样式css，急需各位大神帮助，事关毕业设计求大神们帮帮忙。。...
本人在做一个基于java web的晚上书店，代码部分别的都还好就是苦于不会写页面html和样式css，急需各位大神帮助，事关毕业设计求大神们帮帮忙。。
展开
展开全部
先看效果：
代码：
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>书店</title>
<style type="text/css">
*{
padding:0;
margin:0;
轮老悄 box-sizing:border-box;
}
li{
list-style:none;
}
.wrap{
width:960px;
margin:0 auto;
}
.header{
overflow:hidden;
margin:10px auto;
}
.logo{
font-size:20px;
color:#00F;
text-align:center;
line-height:100px;
height:100px;
width:20%;
float:left;
}
.banner{
height:100px;
width:80%;
float:left;
border:1px solid #00F;
font-size:30px;
text-align:center;
line-height:100px;
background:#990;
}
.nav ul{
width:100%;
background:#6CC;
overflow:hidden;
}
.nav ul li{
float:left;
line-height:30px;
margin-right:15px;
}
.nav ul li a{
color:#000000;
text-decoration:underline;
}
.main{
margin-top:20px;
overflow:hidden;
}
.sidebar{
width:200px;
float:left;
}
.login{
border:1px solid #06F;
}
.login h2{
line-height:24px;
background:#6CC;
color:#000000;
text-align:center;
font-size:18px;
font-weight:normal;
}
.login p{
margin:10px 10px;
}
.login p input{
width:100px;
}
.login button{
background:none;
border:1px solid #000000;
padding:5px 10px;
margin:15px;
}
.car{
margin:30px auto;
width:50px;
height:50px;
border-radius:50%;
background:#C90;
line-height:50px;
text-align:center;
}
.book{
width:750px;
float:right;
}
.book ul li{
border:1px solid #069;
padding:10px;
overflow:hidden;
margin-bottom:20px;
}
.book ul li img{
float:left;
width:100px;
height:120px;
border:1px solid #999;
margin-right:10px;
}
.book ul li .info{
float:left;
}
.book ul li .info p{
margin-bottom:10px;
}
.book ul li .more{
含稿margin-top:20px;
}
.book ul li .more a{
color:#000000;
text-decoration:underline;
}
.book ul li .more .buy{
padding:3px 5px;
background:#FC0;
color:#000000;
border:1px solid #000000;
border-radius:3px;
text-decoration:none;
margin-left:15px;
}
</style>
</head>
<body>
<div class="wrap">
<div class="header">
<div class="logo"><h1>网上书店</h1></div>
<div class="banner">欢迎访问</div>
</div>
<div class="nav">
<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>
腊渣 <div class="main">
<div class="sidebar">
<div class="login">
<h2>用户登录</h2>
<form method="post">
<p>用户名:<input type="text" /></p>
<p>密 码:<input type="password" /></p>
<button>登录</button>
<button>注册</button>
</form>
</div>
<div class="car">
购物车
</div>
</div>
<div class="book">
<ul>
<li>
<img src="http://himg.bdimg.com/sys/portrait/item/9b7fe5889de590bbe7bc980729.jpg">
<div class="info">
<p>名称：图灵</p>
<p>作者：言小鱼</p>
<p>价格：无价</p>
<p class="more"><a href="#">详细信息</a><a href="#" class="buy">购买</a></p>
</div>
</li>
<li>
<img src="http://himg.bdimg.com/sys/portrait/item/9b7fe5889de590bbe7bc980729.jpg">
<div class="info">
<p>名称：图灵</p>
<p>作者：言小鱼</p>
<p>价格：无价</p>
<p class="more"><a href="#">详细信息</a><a href="#" class="buy">购买</a></p>
</div>
</li>
</ul>
</div>
</div>
</div>
</body>
</html>
满意请采纳~
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
