gpt4 book ai didi

php - 'include' 不是独立的样式

转载 作者:太空宇宙 更新时间:2023-11-04 03:14:12 24 4
gpt4 key购买 nike

我正在尝试设置通用导航栏。我正在使用 includemenu.php 导入到 index.php 中。当我这样做时,它工作正常;但是,当我在 menu.php 包含之后添加内容时,菜单的 CSS 规则会继续。

index.php

<!DOCTYPE HTML>
<html>
<head>
<link rel=stylesheet href="css/style.css" />
<title>Home | Website</title>
</head>
<body>
<?php include 'menu.php'; ?>
<p>Test</p>
</body>
</html>

菜单.php

<head>
<title>Menu | Website</title>
<style>
// menu-only styles...
</style>
</head>
<body>
<a href="/">Home</a>
</body>
<?php return; ?>

最佳答案

您实际上是在按照自己的方式在 HTML 页面中包含 HTML 页面。

要让您的 CSS 仅针对您的菜单,请将其保存在您的 style.css 文件中,但让您的 div 具有“菜单”类。

我相信,像这样的东西应该可以满足您的需求。

index.html

<!DOCTYPE HTML>
<html>
<head>
<link rel=stylesheet href="css/style.css" />
<title>Dare Network | Home</title>
</head>
<body>
<?php include 'menu.php'; ?>
<p>Test</p>
</body>
</html>

样式.css

html,body {
padding: 0;
margin: 0;
background-color: #777777;
}

.menu {
/* padding: top&&bottom left&&right; */
padding:10px 0;
background-color: #7786ff;
text-align: center;
}

.menu a {
/* merge transitions into one line to make both functional */
transition: background-color .25s ease-in-out, padding-bottom .25s ease-in-out;
background-color: #b20000;
color: #ffffff;
text-decoration: none;
/* padding:top right bottom left */
padding:10px 10px 5px 10px;
}

.menu a:hover {
background-color: #cc0000;
padding-bottom: 10px;
}

菜单.php

<div class="menu">
<a href="/">Home</a>
</div>

关于php - 'include' 不是独立的样式,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28977299/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com