我在将 laravel 与 .html 文件和 .css 文件一起使用时遇到问题。也许你能帮我 我在 index.blade.php 中有这个片段
<div class="container">
<div class="top">
<div class="navigation">
<a href="index.html">home</a>
<a href="index.html">the journey</a>
<a href="index.html">characters</a>
<a href="index.html">image gallery</a>
<a href="index.html">history</a>
</div>
<div class="pattern"><span></span></div>
<div class="login">
<div class="loginitem">
<form action='login.php' method='post'>
Username: <input type='text' name='username' /><br />
Password: <input type='password' name='password' /><br />
<input type='submit' value='Login' /><br><br>
</form>
</div>
<div class="loginbutton">
<i> Not </i> <a style="color: red;" href="registration.html">registered </a> <i> yet? </i>
</div>
</div>
<div class="pattern"><span></span></div>
</div>
还有我的 index.css 文件中的这个片段
.divider {
background: url(img/divider.gif) no-repeat;
height: 20px;
margin: 24px 0;
}
/* structure */
.container {
background: url(img/bgcontainer.jpg) repeat-y center top;
margin: 0 auto;
width: 736px;
}
.top {
background: url(img/bgcontent.gif) no-repeat 0 -4%;
margin: 0 auto;
text-align: center;
width: 632px;
}
.login .loginitem{
position: relative;
padding-top: 85px;
}
我在使用这些行加载图像时遇到问题
background: url(img/bgcontainer.jpg) repeat-y center top;
background: url(img/divider.gif) no-repeat;
等来自 style.css 文件
我的图像位于它们所属的公共(public)文件夹中名为 img 的文件夹中。只有我的 div 的定位有效。我需要一些帮助,因为我不知道如何使用 laravel 从 .css 文件加载图片。提前致谢。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html>
<head>
{{ HTML::style('css/index.css'); }}
<link href='http://fonts.googleapis.com/css?family=Alegreya+SC:400,400italic' rel='stylesheet' type='text/css'>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1"/>
<meta name="description" content="description"/>
<meta name="keywords" content="keywords"/>
<meta name="author" content="author"/>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Caught in the Middle</title>
</head>
这是我加载 .css 文件的方式
最佳答案
如果你的文件夹结构是
Laravel/Public/css/style.css
和你的图片在你的css文件夹的同一层:
Laravel/Public/img/bg.jpg
而css图片是相对于.css文件的,那你大概应该往下一层进入图片文件夹:
background: url('../img/bgcontent.gif') no-repeat 0 -4%;
这是另一个答案:Is a relative path in a CSS file relative to the CSS file? .
编辑
不要忘记“/public”文件夹中的所有文件并不是由 Laravel 真正控制的。这是一个完全由您的网络服务器控制的文件夹,它将一些控制权传递给 PHP 和 Laravel。因此,当您点击浏览器时,文件:
http:://laravelapplication.com/img/bgcontent.gif
这不是由 Laravel 解决的,而是由您的网络服务器(apache?nginx?)解决的。这就是您拥有的所有 Assets 文件(css、js、png、jpg、gif)所发生的情况。
有时这可能会造成混淆,因为 Laravel 会生成 URL,但是当这些 URL 变成 HTML 时,如果它们指向您的 /public
文件夹中的真实文件,Laravel 将与它们无关。
你怎么知道它们指向公共(public):文件必须存在。如果它不存在,你的网络服务器会将它传递给 public/index.php
然后,是的,它会被 Laravel 处理。
你如何确定这是 Laravel 或 HTML/CSS/Webserver 的东西?获取文件的完整 URL 并将其放入您的浏览器地址:
http:://laravelapplication.com/img/bgcontent.gif
如果您的浏览器显示该图像,则不是 Laravel 在工作,只是您的网络服务器。
除非,当然,你有智能路由为你完成工作,但这是一个更高级的 Laravel 路由问题,我认为这里不是这种情况。
关于html - 在 Laravel 中使用 .css 文件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21830931/