我在一个menu.php中编写了一个菜单,并将其调用到另一个文件。为了减少代码,我只包含了看起来最小/足够的内容。
这是主页面样式中的定义。
#menu{position:absolute;top:100;left:260;height:40;width:490;}
这就是我调用菜单的地方。php
<div id="menu"><?php include("menu.php")?></div>
这就是我定义菜单的方式。
<ul id="menubar">
<li><a href=#>HOME</a></li>
<li><a href=#>NEWS</a></li>
<li><a href=#>RESOURCES</a></li>
<li><a href=#>ABOUT US</a></li>
</ul>
这是menu.php 中的菜单样式
*{margin:0px;padding:0px;}
body{font-size:120%;font-family:arial;background-color:#D4F1FA;padding:50px;}
ul#menubar{list-style-type:none;}
ul#menubar li{width:120px;text-align:center;position:relative;float:left;}
ul#menubar a{color:#DAECF2;text-decoration:none;display:block; width:120px;height:40px;line-height:40px;background-color:#153945}
ul#menubar li:hover>a{background-color:rgba(20,66,82,0.6);color:#C9E6F0}
问题是字体大小和颜色没有保留在主文件中,它只在menu.php中工作。有什么建议吗?
当包含包含其他文件的php文件时,必须编写css的完整路径。
还有一个建议是使用chrome检查器之类的工具来查看是否正确加载了所有文件。
例如:
不要进行
<?php
<link rel="stylesheet" type="text/css" href="../css/style.css">
?>
而是做
<?php
<link rel="stylesheet" type="text/css" href="/website/css/style.css">
?>
这是一种将常见内容添加到文件中的非正统方法。您可以将html添加到函数中并随意调用它,从而使其更加灵活。
function displayNav()
{
echo "<ul id='menubar'>
<li><a href=#>HOME</a></li>
<li><a href=#>NEWS</a></li>
<li><a href=#>RESOURCES</a></li>
<li><a href=#>ABOUT US</a></li>
</ul>";
}
您可以根据需要为其他常见内容添加更多功能。
此外,我建议将css移到外部样式表中;它将使标记页的维护更加容易,并提高了标记页的可读性。