Question

我一直在谷歌搜索，找不到任何可以帮助我把所有部分放在一起的东西。我的规格如下：

有三个文件：index.html，menu.html和style.css
menu.html包含我的菜单所需的所有内容，并由index.html通过html5对象包含。我理解对象可以像这样使用：Include html file in html using html5
style.css可以非常小。也许只是红色背景上的蓝色文字，作为一个例子。

我设法完成的任务：

将menu.html中的文字显示在index.html

我的问题是将所有部分放在一起。如果有人可以帮助为index.html提供所需的行（即，正确引用该样式的对象标记）和非常小的style.css，我将全部设置。

感谢您的帮助，对n00b问题感到抱歉，但我似乎无法找到有关html5对象和CSS的组合的任何内容。

的index.html： http://pastebin.com/xn2PNAsS

menu.html： http://pastebin.com/A72csf14

style.css中： http://pastebin.com/QXxwbpyq

什么是坏的：

我只是无法使用对象（菜单）来使用样式表并且具有红色背景。对于主页面，我希望有一个白色背景。
点击菜单链接似乎在新框架中打开页面。我希望整个页面都能改变。拥有menu.html的原因是坚持DRY范式。

Answer 1

你尝试过这样的事吗？

<object type="text/html" data="menu.html" id="whatever"></object>

在style.css

中

body {
   background-color: #FFFFFF;
}
#whatever {
   background-color:#ff0000;
}

在menu.html中使用链接上的target =“_ top”，来自http://www.w3schools.com/tags/att_a_target.asp，即

<a href="index.html" target="_top">Home</a>

Answer 2

道具想要保持干爽。但是，如果您想要包含这些常见组件，并且希望干净利落，那么您可能需要的不仅仅是HTML和CSS。您需要一种可用于生成公共元素的编程语言（可能还有Web应用程序框架）。流行的选项是C＃/ ASP.NET，Python / Djano，Ruby / Rails和PHP / Zend或Cake。

但是，我无法告诉你完全你需要什么，因为我不知道你想要制作什么类型的网站，或者它有多大的项目。 您可能只能使用server-side includes，这可能是最简单的选择。

纯html5和CSS中非常基本的垂直菜单

2 个答案: