猿问

未在 php 索引和标题中读取 CSS 文件

我正在尝试创建两个 php 页面:标题和索引。我在 html 中创建了它们并定义了它们的样式。现在我想把它们变成 php 文件。所以我创建了文件并将每个 html 文件的内容复制到其中。并将css文件链接放入每个文件的头部。但是在测试时,我没有从我定义的内容中获得任何 css 属性。


我试图复制 css 文件的 while 路径,但它也不起作用。


这是索引代码:


<html>

<head>

    <title>Velo pour tous</title>

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

</head>



<body>

    <?php 

    include 'templates/common/header.php'

    ?>

    <div class="acceuil-block">

        <div class="title">

            <h1>Bienvenue dans le site officiel de l'association des enthousiastes de vélos</h1>

        </div>


        <div class="button">

            <form>

                <label for="">Choisissez une date :  </label>

                <input type="date" id="start_date_interval">

            </form>

        </div>

    </div>

    <div class="sep"></div>

    <div class="sep"></div>

    <div class="acceuil-summary">

    <h1>Découvrez notre association</h1>

    <div class="sep"></div>

    <div class="row">

        <div class="column left">


            <div class="image">

                <img src="stores.png">

            </div>

            <h2>Qui-sommes nous ?</h2>

            <p class="paragraphe_index">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc interdum, sem eu mollis malesuada, magna dolor tempus diam, vitae auctor odio magna in felis..</p>


        </div>

        <div class="column middle">


            <div class="image">

                <img src="icon (3).png">

            </div>


            <h2>Ce nous vous proposons</h2>

            <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc interdum, sem eu mollis malesuada, magna dolor tempus diam, vitae auctor odio magna in felis.</p>


        </div>

        <div class="column right">


            <div class="image">

                <img src="business-card-of-a-man-with-contact-info.png">

            </div>

</body>

</html>


慕森卡
浏览 157回答 2
2回答

狐的传说

您的模板文件和标题都有head标签。这是无效的 HTML。你应该有两个头文件。索引.php:<html><head>&nbsp; <title>Velo pour tous</title>&nbsp; <link rel="stylesheet" type="text/css" href="css/app.css">&nbsp; <?php&nbsp;&nbsp; include 'templates/common/header-head.php'&nbsp; ?></head><body>&nbsp; <?php&nbsp;&nbsp; include 'templates/common/header-body.php'&nbsp; ?>&nbsp; <!-- everything else --></body>头head.php:<meta charset="utf-8"><title>Velo pour tous</title><meta name="description" content=""><meta name="viewport" content="width=device-width, initial-scale=1"><link rel="stylesheet" href="../../css/app.css"><link rel="stylesheet" type="text/css" href="Projet tech web ratt/css/app.css">header-body.php<header>&nbsp; &nbsp; <div class="main">&nbsp; &nbsp; &nbsp; &nbsp; <div class="logo">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <img src="C:\wamp64\www\Projet tech web ratt\ressources\logo.png">&nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; <ul>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <li class="active"><a href="#">Accueil</a></li>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <li><a href="file:///C:/Users/ab/Documents/test%20projet/Qui%20sommes%20nous.html">Qui-sommes nous ?</a></li>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <li><a href="file:///C:/Users/ab/Documents/test%20projet/ce%20que%20nous%20vus%20proposons.html">Ce que nous vous proposons</a></li>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <li><a href="file:///C:/Users/ab/Documents/test%20projet/login.html">Connexion</a></li>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <li><a href="file:///C:/Users/ab/Documents/test%20projet/contact.html">Contactez-nous</a></li>&nbsp; &nbsp; &nbsp; &nbsp; </ul>&nbsp; &nbsp; </div><hr></header>

哈士奇WWW

如果我理解正确,那么 header.php 应该是一个部分文件,对吧?CSS 资产应仅在您的索引文件中定义。根据您的目录结构,这应该有效:由于头文件与索引文件位于同一级别的目录中,因此您可以简单地引用为&nbsp;templates/common/header.php由于header.php中是将在主体注入的部分文件,你不应该重复的HTML标签,如<html>,<head>和<body>。索引.php<html><head>&nbsp; &nbsp; <title>Velo pour tous</title>&nbsp; &nbsp; <link rel="stylesheet" type="text/css" href="css/app.css"></head><body>&nbsp; &nbsp; <?php include 'templates/common/header.php'; ?>&nbsp; &nbsp; ...头文件<header>&nbsp; &nbsp; &nbsp; &nbsp; <div class="main">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <div class="logo">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <!-- You should be able to reference your assets like this -->&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <img src="ressources/logo.png">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <ul>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <li class="active"><a href="#">Accueil</a></li>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <!-- I intentially left out your file pointer because I don't know your directory structure for these -->&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <li>...</li>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </ul>&nbsp; &nbsp; &nbsp; &nbsp; </div>&nbsp; &nbsp; <hr>&nbsp; &nbsp; </header>编辑至于您在 CSS 中引用的图像,我假设您的意思是videoblocks-group-of-young-happy-cyclists.png. 将这些事情考虑在内会很有帮助,就好像您实际站在当前正在运行的文件中一样。所以,如果你的目录结构是:css/app.css&nbsp;ressources/*然后,在处理 CSS 文件时,您需要跳上 1 个目录,然后进入该ressources目录以引用图像。像这样:.image_quiSommesNous{&nbsp; &nbsp; background-image:url(../ressources/videoblocks-group-of-young-happy-cyclists.png);&nbsp; &nbsp; ...}
随时随地看视频慕课网APP
我要回答