gpt4 book ai didi

php - 背景图像不覆盖背景 Laravel

转载 作者:太空宇宙 更新时间:2023-11-04 03:38:35 25 4
gpt4 key购买 nike

我一直在梳理网络,因为它看起来应该是一个非常简单的过程。我希望通过 CSS 将服务器中的图像作为背景分配给我正在处理的页面。我对 Laravel 框架有些陌生,所以这里可能有点不同?

我目前有以下 CSS 定义我的页面主体(包括背景图片):

body {
overflow:auto;
width: 100%;
height: 100%;
background: transparent url('.../img/giant_back_hi.jpg') no-repeat center center;
background-repeat: no-repeat;
background-position: fixed;
-webkit-background-size: cover;
-webkit-filter: cover;
background-size: cover;
color: white;
margin: 0;
padding: 0;
}

和下面的 View 元素来读取它:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,300,300italic,400italic,600' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="resources/css/layout.css" />
<title>my-app</title>
</head>
<body>
@include("header")
<div class="content">
<div class="container">
@yield("content")
</div>
</div>
@include("footer")
</div>
</html>

每当我尝试呈现页面时,一切正常,但背景返回空白。关于我遗漏了什么或如何正确编码的任何想法?

我的目录映射如下:

public
--css
----layout.css
--img
----giant_back_hi.jpg

在此先感谢您的帮助!

编辑我已经确定,当我将定量高度值应用于 css 中的高度属性时,即。 (height:1200px;) 图像显示。

所以,图片显示出来了,只是没有像我告诉的那样覆盖页面...它一直隐藏在我的页眉中,直到我手动调整它的大小。

最佳答案

您使用安装中的 public/ 文件夹作为您的网站的根目录,因此您的 public/css/public/您 View 中的 HTML 和 CSS 可以通过 /css//img/ 访问 img/ 文件夹。

在这种情况下,从 HTML 的 Angular 来看,根目录 (/) 是您的 public/ 目录,因此,在您的 HTML 中,更新指向您的 css 的链接:

<link rel="stylesheet" href="/css/layout.css" />

在你的 CSS 中:

background: transparent url('/img/giant_back_hi.jpg') no-repeat center center;

关于php - 背景图像不覆盖背景 Laravel,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25231268/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com