欧美一区二区三区,国内熟女精品熟女A片视频小说,日本av网,小鲜肉男男GAY做受XXX网站

我的css可以在我的html頁面上運行,但是不能在我的php頁面上運行

錢淋西1年前9瀏覽0評論

我為我的投資組合創建了一個項目描述頁面。最初,我想為我的每個項目創建一個html頁面,但是我發現我不需要用PHP和數據庫來完成。所以我用html和css為我的頁面制作了一個模板。css完美地工作。我重新設計了我的html頁面來整合php。只不過現在css只工作了一半!!有些元素是樣式化的(比如視圖按鈕),但大多數元素不是(比如文本)... 我不明白為什么...你能幫助我嗎?

下面是我的基本HTML代碼(css完美地使用了它) :

<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Punkode</title>
    <link rel="stylesheet" href="style.css" />
    <script src="https://kit.fontawesome.com/2c1644d52e.js" crossorigin="anonymous"></script>
  </head>
  <body>
    <div class='stars'></div>
    <div class="container">
      <a href="index.html" class="home">ACCUEIL</a>
      <!-- INTRODUCTION -->
      <div class="intro" >
        <div class="intro-container" style="background: url(img/projets/punkode_photo.png);background-size:cover;background-position: center center;background-repeat: no-repeat;background-attachment: fixed;">
          <div class="project-name">
            <h1 class="highlight"> PUNKODE </h1>
          </div>
        </div>
      </div>
      <!-- PROJECTS -->
      <div class="projects">
        <div class="project">
          <div class="laptop">
            <img src="./img/laptop.png" draggable="false" alt="" />
            <div class="holo"></div>
            <div class="laptopScreen">
              <img src="./img/projets/screen_punkode.jpg" draggable="false" alt="" class="laptopApp" />
            </div>
          </div>
          <div class="projectDetail">
            <h1 class="projectTitle">Projet</h1>
            <p class="projectDesc">
                Ardeo, mihi credite, Patres conscripti (id quod vosmet de me existimatis et facitis ipsi) incredibili quodam amore patriae, qui me amor et subvenire olim impendentibus periculis maximis cum dimicatione capitis, et rursum, cum omnia tela undique esse intenta in patriam viderem, subire coegit atque excipere unum pro universis. 
            </p>
            <button class="view-button">Voir</button>
          </div>
        </div>
        
        <div class="project">
          <div class="chibi">
            <img src="./img/projets/chibi_punkode.png" alt="" />
          </div>
          <div class="projectDetail">
            <h1 class="projectTitle">Mon r?le</h1>
            <p class="projectDesc">
                Hic me meus in rem publicam animus pristinus ac perennis cum C. Caesare reducit, reconciliat, restituit in gratiam.
            </p>
          </div>
        </div>
        
      </div>
</body>

下面是我用php編寫的代碼,它直接檢索我的數據庫的一個表中的元素:

<?php
// Inclure le fichier de configuration de la base de données
require_once 'config.php';

if (isset($_GET['id']) && !empty($_GET['id'])) {
    try {
        // Récupérer l'ID de la trace depuis l'URL
        $traceId = $_GET['id'];

        // Récupérer les détails de la trace depuis la base de données
        $sql = "SELECT * FROM trace WHERE immatriculation = :id";
        $stmt = $bdd->prepare($sql);
        $stmt->bindParam(':id', $traceId);
        $stmt->execute();
        $trace = $stmt->fetch();

        // Vérifier si une trace correspondante a été trouvée
        if ($trace) {
            // Afficher les détails de la trace
            ?>
            <html lang="en">
              <head>
                <meta charset="UTF-8" />
                <meta http-equiv="X-UA-Compatible" content="IE=edge" />
                <meta name="viewport" content="width=device-width, initial-scale=1.0" />
                <title><?php echo $trace['nom_trace']; ?></title>
                <link rel="stylesheet" href="style.css" />
                <script src="https://kit.fontawesome.com/2c1644d52e.js" crossorigin="anonymous"></script>
              </head>
              <body>
                <div class='stars'></div>
                <div class="container">
                  <a href="index.html" class="home">ACCUEIL</a>
                  <!-- INTRODUCTION -->
                  <div class="intro" >
                    <div class="intro-container" style="background: url('<?php echo $trace['image_couverture']; ?>');background-size:cover;background-position: center center;background-repeat: no-repeat;background-attachment: fixed;">
                      <div class="project-name">
                        <h1 class="highlight"> <?php echo $trace['nom_trace']; ?> </h1>
                      </div>
                    </div>
                  </div>
                  <!-- PROJECTS -->
                  <div class="projects">
                    <div class="project">
                      <div class="laptop">
                        <img src="./img/laptop.png" draggable="false" alt="" />
                        <div class="holo"></div>
                        <div class="laptopScreen">
                          <img src="<?php echo $trace['image_description']; ?>" draggable="false" alt="" class="laptopApp" />
                        </div>
                      </div>
                      <div class="projectDetail">
                        <h1 class="projectTitle">Projet</h1>
                        <p class="projectDesc">
                          <?php echo $trace['description_projet']; ?>
                        </p>
                        <a href="<?php echo $trace['lien_trace']; ?>" class="view-button">Voir</a>
                      </div>
                    </div>
                    
                    <div class="project">
                      <div class="chibi">
                        <img src="./img/projets/chibi_punkode.png" alt="" />
                      </div>
                      <div class="projectDetail">
                        <h1 class="projectTitle">Mon r?le</h1>
                        <p class="projectDesc">
                            <?php echo $trace['description_role']; ?>
                        </p>
                      </div>
                    </div>
                  </div>

                  <div class="footer">
                    <div class="row">
                      <p> 2023</p>
                    </div>
                  </div>
                </div>
                <script src="trois.js"></script>
              </body>
            </html>
            <?php
        } else {
            // Aucune trace correspondante trouvée
            echo 'Trace introuvable.';
        }
    } catch (PDOException $e) {
        echo "Une erreur s'est produite lors de l'exécution de la requête : " . $e->getMessage();
    }
} else {
    // ID de la trace non fourni dans l'URL
    echo 'ID de trace non spécifié.';
}
?>

這是我的CSS文件的一個片段:

.projects {
    display: flex;
    flex-direction: column;
    gap: 30vh;
    padding: 0px;
  }
  
  
  .project {
    display: flex;
    align-items: center;
    gap: 100px;
    height: auto;
    overflow: hidden;
  }
  
  .project:first-child {
    flex-direction: row-reverse;
  }
  
  .chibi {
    flex: 1;
    width: 300px;
    height: 600px;
    position: relative;
  }
  .chibi img {
    width: 100%;
  }
  
  .projectDetail {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 50px;
    align-items: center;
    padding:0 100px;
  }
  .strong {
    background-image: linear-gradient(to right, rgb(114, 0, 255), rgb(242, 0, 255));
    padding: 2px 6px;
  }
  
  .projectTitle {
    font-size: 7vw;
    color: rgb(255, 255, 255);
    margin-bottom: 10px;
    margin: 0 4px;
    border-radius: 20px;
    text-shadow: 0 0 15px rgb(114, 0, 255), 0 0 25px rgb(114, 0, 255);
    animation: glow 1.5s linear infinite;
    animation: animate 3s linear infinite;
  }
  .projectDesc {
    font-size: 20px;
    color: #dedede;
    text-align: justify;
    line-height: 40px;
  }
  .view-button:hover {
    cursor: pointer;
    transform: scale(1.4);
    color: rgba(255, 255, 255, 1);
    animation: glow 1.5s linear infinite;
    animation: animate 3s linear infinite;
 }
 .view-button:hover::after {
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
 }
  .view-button:hover::before {
    opacity: 0.5;
    height: 140%;
    width: 120%;
    left: -10%;
    top: -20%
     }

非常感謝!