代码：
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>新浪网</title>
</head>
<style>
ul.menu > li{
list-style: none;
}
ul.menu {
background-color: #f9fbfc;
width: 800px;
height: 70px;
}
ul > li {
width: 80px;
height: 40px;
float: left;
text-align: center;
margin-top: 30px;
color: rgb(16, 15, 15);
}
div.left{
width: 500px;
height: 380px;
text-align: center;
border: 1px solid rgb(196, 193, 193);
}
div.reight{
position: absolute;
top: 102px;
left: 508px;
width: 250px;
height: 380px;
text-align: center;
border: 1px solid rgb(196, 193, 193);
}
div.least{
width: 750px;
height: 50px;
text-align: left;
}
.style1{
font-size: 12px;
color: rgb(16, 15, 15);
}
</style>
<body>
<div class="top">
<ul class="menu">
<li >手机注册</li>
<li >邮箱注册</li>
</ul>
</div>
<div class="left">
<div >
<form action="#" method="post">
<p >
<i style="color: crimson;">·</i>
手机号码：<input type="text" name="手机号码" id="手机号码"><br>
<span class="style1"> 使用微博账号直接<a href="https://www.sina.com.cn/" style="color: rgb(69, 173, 239);">登录</a></span>
</p>
<p>
<i style="color: crimson;">·</i>
设置密码：<input type="password" name="设置密码" id="设置密码">
</p>
<p>
<i style="color: crimson;">·</i>
兴趣标签：
<input type="checkbox" name="兴趣标签" value="新闻">新闻
<input type="checkbox" name="兴趣标签" value="娱乐">娱乐
<input type="checkbox" name="兴趣标签" value="文化">文化
<input type="checkbox" name="兴趣标签" value="体育">体育
<input type="checkbox" name="兴趣标签" value="IT">IT <br>
<input type="checkbox" name="兴趣标签" value="财经">财经
<input type="checkbox" name="兴趣标签" value="时尚">时尚
<input type="checkbox" name="兴趣标签" value="汽车">汽车
<input type="checkbox" name="兴趣标签" value="房产">房产
<input type="checkbox" name="兴趣标签" value="生活">生活
</p>
<p>
<i style="color: crimson;">·</i>
上发短信手机：<input type="text" name="手机" id="手机" disabled placeholder="我要使用注册手机发送短信">
</p>
<p style="font-size: 15px;">
<a href="https://www.sina.com.cn/" style="text-decoration: none; color: #5cb4f4;" >《新浪网络服务使用协议》</a>
</p>
<p style="font-size: 15px;">
<a href="https://www.sina.com.cn/" style="text-decoration: none; color: #5cb4f4;" >《新浪个人信息保护政策》</a>
</p>
</form>
</div>
</div>
<div class="reight">
<p align="center">
已有帐号，<a style="text-decoration: none; color: #5cb4f4;" href="https://www.sina.com.cn/" >直接登录</a>>>
</p>
</div>
<div class="least" >
<p style="font-size: 13px; line-height:5px;">
<a style="text-decoration: none; color: #5cb4f4; " href="#">新浪简介</a>
<a style="text-decoration: none; color: #5cb4f4;" href="#">About Sina</a>
<a style="text-decoration: none; color: #5cb4f4;" href="#">广告服务</a>
<a style="text-decoration: none; color: #5cb4f4;" href="#">联系我们</a>
<a style="text-decoration: none; color: #5cb4f4;" href="#">招聘信息</a>
<a style="text-decoration: none; color: #5cb4f4;" href="#">网站律师</a>
<a style="text-decoration: none; color: #5cb4f4;" href="#">SINA English</a>
<a style="text-decoration: none; color: #5cb4f4;" href="#">注册</a>
<a style="text-decoration: none; color: #5cb4f4;" href="#">产品答疑</a>
</p>
<p style="font-size: 13px; line-height:3px;" >
客户服务电话 400-052-0066 欢迎批评指正
</p>
<p style="font-size: 13px; line-height: 5px;">
Copyright 1996-2020 SINA Corporation, All Rights Reserved 新浪公司 <a style="text-decoration: none; color: #5cb4f4;" href="#">版权所有</a>
</p>
</div>
</body>
</html>
运行结果：
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
