您的位置：首页 > 其它

网页全屏背景设计

2017-10-13 16:10 134 查看

body{
text-align:center;
margin:0;
background-image:url(https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1507892240189&di=69b352da384dd7ad36aec8e75705361d&imgtype=0&src=http%3A%2F%2Fp.yjbys.com%2Fimage%2F20161207%2F1481083539122730.jpg);
background-repeat:no-repeat;
background-position:center center;
background-attachment:fixed;
background-size:cover;
}

#login{
margin:0 auto;
width:300px;
text-align:right;
}
#login input{
margin:5px;
}

<!DOCTYPE HTML>
<html>
<head>
<title>QA系统</title>
<link rel="stylesheet" type="text/css" href="test.css"/>
</head>
<body>
<div id="container">
<div id="login">
<form>
公司邮箱：<input type="email" name="email" autocomplete="on" autofocus placeholder="请使用邮箱名" required/><br/>
密       码：<input type="password" name="password" required placeholder="请输入密码"/><br/>
<input type="submit" value="登录"/>
</form>
</div>
<script>
var container=docment.getElementById("container");
container.style.backgroundImage="url(http://www.iteye.com/upload/logo/user/37073/648c9ed4-f54b-3f4a-ac54-905f5a483307.gif?1236833802)";
</script>
</div>
</body>
</html>

效果截图：

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航