dou11655853
dou11655853
2017-07-19 19:21

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?

  • 点赞
  • 写回答
  • 关注问题
  • 收藏
  • 复制链接分享
  • 邀请回答

1条回答

  • dph6308 dph6308 4年前

    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>
    
    点赞 评论 复制链接分享