<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>电商</title>

<style>

*{

padding:0px;

margin:0px;

}

html,body{

width:100%;

height:100%;

overflow-y: hidden;

}

.top{

height:50px;

width:100%;

background-color:black;

}

.center{

height:15%;

width:100%;

background-image: url(img/wenzi.png);

background-repeat:repeat-y;

}

.next{

width:100%;

height:15%;

}

.bottom{

height:15%;

background-image:url(img/logo1.jpg);

background-repeat:no-repeat;

}

ul li{

display:inline-block;

height:15px;

line-height: 40px;

margin-left:20px;

}

a{

display:block;

height:40px;

color:gray;

}

</style>

</head>

<body>

<div class="top">

<ul>

<li><a><img src="http://img.studyofnet.comimg/logo1.jpg"width="100";height="50"></a></li>

<li><a>登录</a></li>

<li><a>注册</a></li>

</ul>

</div>

<div class="center">

</div>

<div class=".next">

<ul>

<li><img src="http://img.studyofnet.comimg/new.jpg" style="position:absolute; left:600px; top:250px; "/></li>

</ul>

<span><img src="http://img.studyofnet.comimg/pic1.jpg"></span>

<span><img src="http://img.studyofnet.comimg/pic2.jpg"></span>

<span><img src="http://img.studyofnet.comimg/pic3.jpg"></span>

<ul>

<li><img src="http://img.studyofnet.comimg/shizhuang.jpg" </li>

</ul>

<span><img src="http://img.studyofnet.comimg/try1.jpg" </span>

<span><img src="http://img.studyofnet.comimg/try2.jpg" </span>

<span><img src="http://img.studyofnet.comimg/try3.jpg" </span>

</div>

<div class="bottom">

<span>姓名:</span>

<input type="text" placeholder="请输入" id="username" name="username">

<span>邮箱:</span>

<input type="text" placeholder="请输入" id="username" name="username">

<br>

<span>电话:</span>

<input type="text" placeholder="请输入" id="username" name="username">

<span>qq:</span>

<input type="text" placeholder="请输入" id="username" name="username">

<span>留言</span>

<textarea rows="5" cols="50"></textarea>

<input type="submit" value="用户注册"/>

</div>

</body>

</html>

电商网站前端源码(实训写的html电商网页代码)(1)

,