2.2、HTML常见标签 - QQ空间框架【补交作业】 - 已锁定
<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<title>QQ空间-分享生活,留住感动</title>
<link rel="icon" href="ico.ico" type="x-icon">
<style>
body{
font-family: "华文细黑";
width: 100%;
height:100%;
background:url("bg.jpg") no-repeat;
background-size: 100%;
}
a{ text-decoration:none}
a:hover{ text-decoration:underline}
li{float: left;}
</style>
</head>
<body >
<div>
<img src="Q.jpg" width="300" height="300" style="position:absolute; left:350px; top:50px;">
</div>
<div style="position:absolute; right:450px; top:200px;
color:black;
background-color:white;
>
<h3>账号密码登录</h3>
<p>推荐使用<a href="E.png"><span style="color:blue">快速安全登录</span></a>
防止盗号。
</p>
<input type="text">
<br/>
<input type="password">
<br/>
<inptu type="submit" value="登录">
<a href="https://aq.qq.com/v2/uv_aq/html/reset_pwd/pc_reset_pwd_input_account.html?v=3.0&old_ver_account=">忘了密码?</a>
<a href="https://ssl.zc.qq.com/v3/index-chs.html">注册新账号</a>
<a href="https://support.qq.com/products/14800">意见反馈</a>
</div>
<div style="position:absolute; right:600px; bottom:120px;
>
<ul>
<li></li>
<li><a href="https://z.qzone.com/download.html">iphone</a></li>
<li><a href="https://z.qzone.com/download.html">ipad</a></li>
<li><a href="https://z.qzone.com/download.html">Android</a></li>
<li><a href="https://z.qzone.com/download.html">Windows<br/>Phone</a></li>
<li><a href="https://z.qzone.com/download.html">其他手机</a></li>
</ul>
</div>
<div style="position:absolute;left:500px;bottom:20px;>
<p>
<a href="http://support.qq.com/discuss/46_1.shtml"><span style="color:black">反馈建议</span></a>|
<a href="https://qzone.qzone.qq.com/"><span style="color:black">官方空间</span></a>|
<a href="https://act.qzone.qq.com/"><span style="color:black">空间活动</span></a>|
<a href="https://game.qzone.qq.com/?from=gameapp"><span style="color:black">空间应用</span></a>|
<a href="https://user.qzone.qq.com/949589999/main"><span style="color:black">腾讯原创馆</span></a>|
<a href="http://connect.qq.com/"><span style="color:black">QQ互联</span></a>|
<a href="http://connect.qq.com/intro/login/"><span style="color:black">QQ登录</span></a>|
<a href="http://connect.qq.com/intro/share/"><span style="color:black">社交组织</span></a>|
<a href="http://wiki.open.qq.com/wiki/%E6%8A%95%E8%AF%89%E6%8C%87%E5%BC%95"><span style="color:black">应用侵权投诉</span></a>"|"
<a href="http://wiki.open.qq.com/wiki/Tencent_Open_Platform_Complaint_Guidelines"><span style="color:black">Complaint Guidelines</span></a>|
</p>
<p>
Copyright © 2005 - 2018 Tencent.
<a href="http://www.tencent.com/en-us/le/copyrightstatement.shtml"><span style="color:black">All Rights Reserved.</span></a>
<br/>
腾讯公司
<a href="http://www.tencent.com/law/mo_law.shtml?/law/copyright.htm"><span style="color:black">版权所有</span></a>
<a href="http://www.qq.com/culture.shtml"><span style="color:black">粤网文[2017]6138-1456号</span></a>
</p>
</div>
</body>
</html>
不可解决问题如下:
1.背景图无法100%显示
2.登录框无法在div里加载
3.div里h标签p标签无法正常显示
3.做不到div里文本归中
4.做不到div设置某一位置后横向归中
5.做不到快速登录页面二维码小屏展示
6.做不到背景图上叠加图片边缘透明(例如左上角图片)
打赏我,让我更有动力~
返回首页
CTF&WP专版
Track-方丈
发表于 2018-3-21
通过，积分金币已发放。
除第6点外，其余均可用CSS+JS实现。
第6点只需叠加的图片背景透明（png，gif格式）。
评论列表
加载数据中...