html - 视差背景不重复
问题描述
我正在尝试为我的一项作业编写一个网站,我想要一个平铺的视差背景,我检查了我的代码,但我不知道为什么它不起作用。图像是正确的,它显示但只在中间,它没有平铺。它也奇怪地裁剪在导航栏后面。
#navbar {
overflow: hidden;
background-color: #f1f1f1;
padding: 90px 10px;
transition: 0.4s;
position: fixed;
width: 100%;
top: 0;
z-index: 99;
}
#navbar a {
float: left;
color: black;
text-align: center;
padding: 12px;
text-decoration: none;
font-size: 18px;
line-height: 25px;
border-radius: 4px;
}
#navbar #logo {
font-size: 35px;
font-weight: bold;
transition: 0.4s;
}
#navbar a:hover {
background-color: lightgoldenrodyellow;
color: gold;
}
#navbar a.active {
background-color: lightgoldenrodyellow;
color: black;
}
#navbar-right {
float: right;
}
@media screen and (max-width: 580px) {
#navbar {
padding: 20px 10px !important;
}
#navbar a {
float: none;
display: block;
text-align: left;
}
#navbar-right {
float: none;
}
{
background-image: url("HA%20paintbrush%20aids.png");
background-attachment: fixed;
background-position: center;
background-repeat: repeat;
background-size: 500px 500px;
}
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="stylesheet.css">
</head>
<body>
<div id="navbar">
<a href id="logo">tamia.</a>
<div id="navbar-right">
<a href="#artist_statement">Artist Statement</a>
<a class="active" href="#polished_pieces">Pieces</a>
</div>
</div>
<div class="parallax"></div>
</body>
</html>
我的代码有什么问题?我真的很害怕不得不重新开始大声笑。我正在使用括号来编码和预览我的代码。
解决方案
推荐阅读
- angular - 异步操作符和订阅 observable 有什么区别?
- powershell - 为什么我无法检索自定义环境变量?
- postgresql - 转换为int而不是十进制?
- hapi-fhir - hapi fhir 服务器完整的交钥匙实施
- java - 如何使控制台命令可用于用 Java 编写的 AWS Lambda
- haskell - 来自 Int -> Int 的递归方案?
- c# - 如何使用 Visual Studio 2017 启动 Web 项目
- javascript - 在 where 子句中传递动态查询时未处理的拒绝 SequelizeDatabaseError
- mysql - 如何运行 Docker 的容器以访问 MySQL 数据库
- php - 无法访问 PHP/Twig 中命名数组键的值