|
马上注册,结交更多好友,享用更多功能^_^
您需要 登录 才可以下载或查看,没有账号?立即注册
x
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>欢迎来到HTML世界</title>
<style type="text/css">
html,body{
height: 100%;
color: #FF0088;
font-family: sans-serif;
}
body{
background: url(H_0334.jpg) center center;
background-size: cover;
margin: 0;
padding: 0;
position: relative;
}
#container{
width: 100%;
text-align: center;
position: absolute;
top: 50%;
transform: translateY(-50%);
h1{
font-size: 78px;
margin-bottom: 22px;
}
p{
font-size: 33px;
margin-bottom: 22px;
}
a{
font-size: 88px;
background: #33FFFF;
color: #999;
border: 1px solid #33FFF;
border-radius: 10px;
padding: 10px 66px;
text-decoration: none;
}
}
</style>
</head>
<body>
<div id="container">
<h1>我爱我家</h1>
<p>www.FishC.com -让编程改变世界</p>
<a href="http://bbs.fishc.com">传送门</a>
</div>
</body>
</html>
在对比下:
- <style type="text/css">
- html,body{
- height: 100%;
- color: #FF0088;
- font-family: sans-serif;
-
- }
- body{
- background: url(H_0334.jpg) center center;
- background-size: cover;
- margin: 0;
- padding: 0;
- position: relative;
-
- }
- #container{
- width: 100%;
- text-align: center;
- position: absolute;
- top: 50%;
- transform: translateY(-50%);
- }
- h1{
- font-size: 78px;
- margin-bottom: 22px;
- }
- p{
- font-size: 33px;
- margin-bottom: 22px;
- }
- a{
- font-size: 88px;
- background: #33FFFF;
- color: #999;
- border: 1px solid #33FFF;
- border-radius: 10px;
- padding: 10px 66px;
- text-decoration: none;
-
- }
- </style>
复制代码
|
-
|