dou11655853
dou11655853
2017-07-19 19:21
浏览 171
已采纳

PHP插入时CSS不起作用

I have been trying to use PHP to insert my CSS's file contents in the style tag of a page.

<style>
    <?php 
        $css = file_get_contents('css/roboto-robotocondensed.css');
        $css .= file_get_contents('css/reset.css');
        $css .= file_get_contents('css/mainstyle.css');
        $css .= file_get_contents('css/industriaalimentosebebidas.css');
        echo $css;
    ?>
</style>

And in the last file, "industriaalimentosebebidas.css", i have the following code:

header {
    height: 500px; 
    background: url(../img/cases/casos-de-sucesso-alimentos-e-bebidas-cover.jpg) no-repeat center bottom / cover;
}

header p { 
    width: 75%;
    font-size: 1.536rem;
}
.imgGradient {
    height: 100%;
} 

@media only screen and (min-width: 1600px) {
    header {
        height: 700px;
    }
}

For some reason, the header style code above the media query is being ignored by the browser. But, when I get the CSS file using

<link rel="stylesheet" type="text/css" href="css/industriaalimentosebebidas.css"/>

everything works fine.

In the inspector, the header height does not seem to be overwritten... and background image is not being loaded.

Even if I remove the media query part, the header part does not work.

In the html head I'm using

<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no"/>

Does anyone have a clue of what might be going on?

图片转代码服务由CSDN问答提供 功能建议

我一直在尝试使用PHP在 style 标签中插入我的CSS文件内容 页面。

 &lt; style&gt; 
&lt;?php 
 $ css = file_get_contents('css / roboto-robotocondensed.css'); 
 $ css  。= file_get_contents('css / reset.css'); 
 $ css。= file_get_contents('css / mainstyle.css'); 
 $ css。= file_get_contents('css / industriaalimentosebebidas.css'); 
 echo  $ css; 
?&gt; 
&lt; / style&gt; 
   
 
 

在最后一个文件“industriaalimentosebebidas.css”中,我有以下代码:< / p>

  header {
 height:500px;  
 background:url(../ img / cases / casos-de-sucesso-alimentos-e-bebidas-cover.jpg)no-repeat center bottom / cover; 
} 
 
header p {
 width:  75%; 
 font-size:1.536rem; 
} 
.imgGradient {
 height:100%; 
} 
 
 @ media only screen and(min-width:1600px){
 header  {
 height:700px; 
} 
} 
   
 
 

由于某种原因,浏览器会忽略媒体查询上方的标题样式代码。 nBut,当我使用

 &lt; link rel =“stylesheet”type =“text / css”href =“css / industriaalimentosebebidas.css”/&gt;获取CSS文件时 
   
 
 

一切正常。

在检查器中,标题高度似乎没有被覆盖...和背景 图像未加载。

即使我删除了媒体查询部分,标题部分也不起作用。

在html 中 head 我正在使用

 &lt; meta name =“viewport”content =“width = device-width,initial-scale = 1.0,user-scalable = 没有“/&GT; 
   \  n 
 

有没有人知道可能发生的事情?

  • 点赞
  • 写回答
  • 关注问题
  • 收藏
  • 邀请回答

1条回答 默认 最新

  • dph6308
    dph6308 2017-07-19 19:32
    已采纳

    in your css look for the line:

    #infos .imgContainer{max-height:25vw}1rem}
    

    this is the reason it is broken.

    original:

    basically add spaces between the files: (not semicolons, remembered that wrong)

    <style>
    <?php 
        echo implode("
    ", [
            file_get_contents('css/roboto-robotocondensed.css'),
            file_get_contents('css/reset.css'),
            file_get_contents('css/mainstyle.css'),
            file_get_contents('css/industriaalimentosebebidas.css')
        ]);
    ?>
    </style>
    
    点赞 评论

相关推荐