我对网页设计很陌生,需要很多帮助。 我想创建我自己的网站。背景将成为标题。 在背景上,徽标将位于左侧,而导航栏位于右侧。文字也将以背景为中心。这是一个例子。此外,绝对意味着什么?任何人都可以解释给我吗?任何帮助是极大的赞赏!感谢 这是一个例子:如何将背景图像设置为带徽标和导航栏的标题?
这是我的代码....
* {
\t box-sizing: border-box;
\t margin: 0;
\t padding: 0;
}
.container {
\t position: absolute;
\t left: 0;
\t top: 0;
\t width: 100%:
\t height: 100%;
\t
}
.hero {
\t height: 100%:
\t width: 100%;
\t background-image:url(../images/Background.png);
\t background-size: cover;
\t background-repeat: no repeat;
\t background-position: center center;
\t
}
nav ul {
\t margin: 0;
\t padding: 0;
\t list-style: none; /* remove bullet point */
\t float: right;
}
nav li {
\t display: inline-block;
\t margin: 1em;
\t padding: 0.5em; \t
}
nav a {
\t font-weight: 800;
\t text-decoration: none;
\t text-transform: uppercase;
}
nav ul a:hover {
\t color: #f13647;
\t transition: all 0.5s ease-in;
\t padding: 15px 0; \t \t \t \t \t
}
<!DOCTYPE html>
<html lang="en">
<head>
<title>Josh</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="js/modernizr.custom.40753.js" type="text/javascript"></script>
<link rel="stylesheet" href="css/Test.css">
</head>
<body>
\t <header>
\t \t <div class="container">
\t \t \t <div class="hero">
\t \t \t \t <img src="images/logoo.png" alt="Logo FitnessX " class="logo">
\t \t \t \t <nav class="sitenavigation">
\t \t \t \t \t <ul>
\t \t \t \t \t \t <li><a href="index.html">Home</a></li>
\t \t \t \t \t \t <li><a href="aboutus.html">About Me</a></li>
\t \t \t \t \t \t <li><a href="Work.html"></a>Work</li>
\t \t \t \t \t \t <li><a href=""></a>Blog</li>
\t \t \t \t \t </ul>
\t \t \t \t </nav>
\t \t \t \t <div class="home-hero">
\t \t \t \t \t <h2>Hello my name is josh</h2>
\t \t \t \t \t <p>I am 18 years old</p>
\t \t \t \t </div>
\t \t \t </div>
\t \t </div>
\t </header>
</body>
</html>
**一个元素位置:相对;相对于其正常位置定位。**我没有看到你的意思 – 2017-08-04 03:05:19