Css不适用于php文件

时间:2017-05-13 21:50:42

标签: php html css

CSS文件将所有更改应用于我的medlemmer.html和我的cw.html,但不应用于我的index.php。是因为它是.php文件还是什么?我已经尝试了不同的方法来将php链接到css,但是它们中的任何一个都可以工作。

的index.php

<!DOCTYPE html>
<!-- HTML5 Boilerplate -->
<!--[if lt IE 7]>      <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]>         <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]>         <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]-->

<head>

 <!--Import Google Icon Font-->
      <link href="http://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
      <!--Import materialize.css-->
      <link type="text/css" rel="stylesheet" href="css/materialize.min.css"  media="screen,projection"/>

      <!--Let browser know website is optimized for mobile-->
      <meta name="viewport" content="width=device-width, initial-scale=1.0"/>

    <meta charset="utf-8">
    <!-- Always force latest IE rendering engine & Chrome Frame -->
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

    <title>WinRAR - Hjem</title>
    <meta name="description" content="This is the Responsive Grid System, a quick, easy and flexible way to create a responsive web site.">
    <meta name="keywords" content="responsive, grid, system, web design">

    <meta name="author" content="www.grahamrobertsonmiller.co.uk">

    <meta http-equiv="cleartype" content="on">

    <link rel="shortcut icon" href="/favicon.ico">

    <!-- Responsive and mobile friendly stuff -->
    <meta name="HandheldFriendly" content="True">
    <meta name="MobileOptimized" content="320">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <!-- Stylesheets -->
    <link rel="stylesheet" href="css/html5reset.css" media="all">
    <link rel="stylesheet" href="css/col.css" media="all">
    <link rel="stylesheet" href="css/2cols.css" media="all">
    <style type="text/css">

    /*  
    ======================== 
    - Note: These styles are just to pretty the basic page up a bit.
    You should ignore these when copying and pasting into your site 
    because your stylesheet should take care of making it look pretty!
    ======================== 
    */
    body { padding:2em; font : 100%/1.4 'Roboto Condensed', Helvetica, sans-serif;  
 }
    h1 { font-size:2.2em; padding:0 0 .5em 0; }
    h2 { font-size:1.5em; }
    .header { padding:1em 0; }
    .col { background: black; color: white; padding: 1% 0; text-align: center;}

    </style>

<link rel="stylesheet" href="demo.css">
<link rel="stylesheet" href="header-fixed.css">
<link rel="stylesheet" type="text/css" href="css/style.css">
<link href='http://fonts.googleapis.com/css?family=Cookie' rel='stylesheet' type='text/css'>

<link href="http://fonts.googleapis.com/css?family=Roboto+Condensed:400,300,700" rel="stylesheet" type="text/css">

</head>
<body>

<header class="header-fixed">

    <div class="header-limiter">

        <h1><a href="#">Win<span>Rar</span></a></h1>

        <nav>
            <a href="index.php" class="selected">Hjem</a>
            <a href="medlemmer.html">Medlemmer</a>
            <a href="cw.html">ClanWars</a>
            <a href="#">Doner</a>
        </nav>

    </div>

</header>

<!-- You need this element to prevent the content of the page from jumping up -->
<div class="header-fixed-placeholder"></div>

<div class="headbanner">
    <center>
<div class="headBannerText">
WinRaR</center>
</div>
    
</div>

<div class="infonav">
    <div class="infonavText">
        <center>Teamspeak 3: ts.winrarbw.no</center>
    </div>
</div>

    <!-- HEADER SLUTTER HER -->
    <center>

    <br><br>
                        <div id="wrapper">

    <div id="right">

        <div class="parent">

            <div class="main">

                <p>Månedens klanspillere</p>

                <div class="content" style="font-size: 19px">
               
                    <img src="https://mcapi.ca/avatar/Steve/30/true"><b> Spiller1<br>
                    <img src="https://mcapi.ca/avatar/Steve/30/true"> Spiller2<br>
                   <img src="https://mcapi.ca/avatar/Steve/30/true"> Spiller3</b><br>
                   <i>Månedens klanspiller kommer snart!</i>
                  
                </div>
            </div>
       </div>

        <div class="parent">

            <div class="main">

                <p>Klan Info</p>

                <div class="content">

                    <b>Totale medlemmer:</b> 8<br>
                    <b>Åpnet:</b> 12.05.2017<br>
                    <b>ClanWars' spilt:</b> 0

                </div>
            </div>
        </div>  
        
    </div>

    <div id="left">


                         <?php include "fusion/upload/news.php"; ?>
        
    
  </div>
</div>

<div class="footer"><div class="footerText">
<b>WinRar</b> Bedwars Clan | GommeHD & PvPHeroes<br>
Copyright &copy; 2017 | Coded by Thesevs
</div></div>


                <script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script>

    $(document).ready(function(){

        var showHeaderAt = 150;

        var win = $(window),
                body = $('body');

        // Show the fixed header only on larger screen devices

        if(win.width() > 600){

            // When we scroll more than 150px down, we set the
            // "fixed" class on the body element.

            win.on('scroll', function(e){

                if(win.scrollTop() > showHeaderAt) {
                    body.addClass('fixed');
                }
                else {
                    body.removeClass('fixed');
                }
            });

        }

    });

</script>

</center>
</body>

            
                </html>

的style.css

body {
  background-color: #F2F2F2;
}

.userName {
  font-size: 20px;
}

.user {
  display: inline-block;
  margin-left: 5%;
  margin-top: 1%;
}

.body_large {
  background-color: white;
  height: auto;
  margin-top: 1.5%;
  color: black;}

.box_text {
  padding: 3%;
  font-size: 14px;
}

.headbanner {
  background-image: url("http://winrarbw.esy.es/winrar/banner.jpg");
  width: 100%;
  height: 22%;
}

.headBannerText {
  color: white;
  font: normal 90px Cookie, Arial, Helvetica, sans-serif;
  padding: 8% 0%;
}

.infonav {
  background-color: #01A9DB;
  box-shadow:0 1px 1px #ccc;
  height: 40px;
  color: #ffffff;
  box-sizing: border-box;

  -webkit-transition:top 0.3s;
  transition:top 0.3s;
}

.infonavText {
  color: white;
  padding: 0.5%;
  font:19px 'Roboto Condensed', Helvetica, sans-serif;
}

body {
      font-family: 'Roboto Condensed', Helvetica, sans-serif;
}

#wrapper {
      overflow: auto;
      padding: 10px;
}

#right {
     width: 25%;
     float: right;
     margin-right: 10%;
}

#left {
     width: 50%;
     float: left;
     margin-left: 10%;
}

.parent {
      text-align: center;
      border: 1px solid #ccc;
      background-color: #fff;
      padding-top: 5px;
      margin-bottom: 15px;

}

#left .parent {
     margin-bottom: 18px;
}
        
.main {
     background-color: #000;
     padding-bottom: 0px;
      box-shadow: 0px 2px 5px #888888;

}


.main p {
     margin:0;
     color: #fff;
     padding: 10px 0;
     font-size: 18px;
     font-family: 'Roboto Condensed', Helvetica, sans-serif;
}

.main .content {
    background-color: #fff;
    padding: 16px;
    font-size: 14px;
    font-family: 'Roboto Condensed', Helvetica, sans-serif;
}

@media screen and (max-width: 990px) {

    #right, #left {
        float: none;
        width: 100%;
        margin-left: 0px;
        margin-right: 0px;
    }
}

.footer {
  background-color: black;
  height: 150px;
  margin-top: 12%;
}

.footerText {
  color: white;
  font-family: 'Roboto Condensed', Helvetica, sans-serif;
  font-size: 14px;
  padding: 3% 0%;
}

2 个答案:

答案 0 :(得分:0)

一切似乎都没问题。检查您是否在有效路径中有.css文件,并确保问题不在Web浏览器端,清除其缓存或只在少数Web浏览器中尝试。

我在计算机上检查了index.php文件的代码,一切正常。

答案 1 :(得分:0)

在PHP文件中添加CSS没有任何不同的方法。只有PHP文件通过PHP Web服务器呈现,HTML文件不需要Web服务器。

使用ctrl + f5刷新页面,清除浏览器缓存 并通过localhost xampp或wampp

运行php文件