Question

我的网站每页都有菜单。但是，当我尝试在菜单上添加新链接时，我必须单独在每个页面上添加链接。所以，我使用像这样的HTML和CSS，所以我只需编辑一件事，但它只会显示为＆＃34; Home＆＃34;与＆＃34; a＆＃34;标记而不是显示＆＃34; Home＆＃34;作为超链接。

<!DOCTYPE html>
<html>
  <head>
  <style>
    .menu:after{
    content: "<a href="/index.html">Home</a><a href="/game">Games</a>";}
  </style>
  <title>Page</title>
  </head>
<body bgcolor="#cccccc">
  <center>
    <div class="menu"></div>
  <center>
</body>
</html>

Answer 1

创建页面调用

menu.php并放置菜单，例如使用您的代码

<a href="/index.html">Home</a><a href="/game">Games</a>;

然后在你的index.php

中

<?php 
include('menu.php');
?>

Answer 2

你不能使用CSS，因为样式必须改变DOM。 CSS根本就没有设计，也没有合法化来改变DOM。

CSS content property: is it possible to insert HTML instead of Text?

您可能应该做的是使用像PHP这样的服务器端预处理语言来进行模板化。

另一个解决方案是使用jQuery（javascript）：

$('.menu').prepend('<a href="/index.html">Home</a>');

Answer 3

这是做错的方法。你真正需要的是使用一种可以模板化的语言。我建议学习PHP，它会让事情变得更容易。使用PHP，您可以拥有一个名为menu.php的文件，其中包含文件内菜单的HTML标记，然后在需要时输入include "menu.php";。 PHP（和类似语言）可以做的远不止这些，你不会后悔学习它。

Answer 4

Yikes，这是一种非常混乱的方式。你不能说或不能说天气......但我真的建议你使用PHP。在PHP文件中创建菜单，比如＆＃39; menu.php＆＃39;并像这样包含它

require_once("menu.php");

您还必须将您放入.html的文件更改为.php。据我所知，你的方法没有性能问题，当你通过将链接放在CSS中来解决你的问题时，这种情况与CSS所代表的一切相悖。 content属性主要用于插入某些不同样式的字符..就像自定义项目符号一样。

Answer 5

正如其他人所提到的，PHP是解决这个问题的最好方法。 Javascript 可以完成此任务，但它不会优雅地破坏。如果Javascript无效或被关闭，您将无法导航。

我想我会提到其他一些可能性。

IFRAME： <iframe src="/nav.html" seamless></iframe>

无缝与旧版浏览器不兼容，但您可以使用css修复此问题。

SSI： 

文件必须保存为.shtml或配置为解析html for ssi

的服务器

每页都有相同的菜单

5 个答案: