添加指向网站所有页面的链接

时间:2014-05-31 17:32:17

标签: html

我正在尝试为我们的团队创建一个简单的网页。 到目前为止,我已在主页中创建了3个链接(简称:Page1),点击Page1中的每个链接将带我到一个新页面(Page2,Page3和Page4)。第2页,第3页和第4页将包含每日更改的每日团队状态报告,但其文件名将保持不变。我会手动删除旧的并每天放入新的。只有Page1将保持不变,这基本上只用于导航到上述3页。

现在,在Page2,Page3和Page4的每一个中,我试图在页面顶部显示3个链接(指向第2,3和4页的链接)。 这可以在不对Page2,Page3和Page 4进行任何更改的情况下完成(因为这意味着我必须每天进行更改)?可以通过向Page1单独添加一些代码来完成吗

1 个答案:

答案 0 :(得分:2)

如果您真的想在一个地方使用链接的HTML,我建议您使用服务器端编程语言。

假设您有四种不同的(静态,无服务器端编程)HTML文件,例如主页为page1.htmlpage2.htmlpage3.html和{{1} }。 因此,由于文件名保持不变,您可以在所有四个HTML文件中为链接放置相同的HTML标记。现在您应该使用CSS以您喜欢的方式设置链接的样式。这个CSS进入另一个文件,例如`styles.css'。

page4.html

的HTML示例
page1.html

<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title>Page 1</title> <meta name="description" content=""> <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- this is the reference to your css --> <link rel="stylesheet" href="styles.css"> </head> <body> <h1>Page 1</h1> <ul class="navigation"> <li><a href="page2.html">Page 2</a></li> <li><a href="page3.html">Page 3</a></li> <li><a href="page4.html">Page 4</a></li> </ul> </body> </html>

的HTML示例
page2.html

<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title>Page 2</title> <meta name="description" content=""> <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- this is the reference to your css --> <link rel="stylesheet" href="styles.css"> </head> <body> <h1>Page 2</h1> <ul class="navigation"> <li><a href="page1.html">Page 1</a></li> <li><a href="page3.html">Page 3</a></li> <li><a href="page4.html">Page 4</a></li> </ul> <!-- here comes the content you will change daily --> </body> </html>

的CSS示例
styles.css

顺便说一下,.navigation { padding-left: 0; list-style: none; margin-left: -5px; } .navigation > li { display: inline-block; padding-left: 5px; padding-right: 5px; } 对于您的主页来说是一个更好的名称,因此您可以使用index.html之类的网址访问该文件,而不必将文件名放在网址中比如http://www.yourDomain.com

现在,您的四个HTML文件中的链接具有相同的HTML标记。这意味着每当您必须更改链接的 HTML 时,您必须在所有HTML文件中执行相同的更改。但是你只需要在一个地方负责布局的代码。

因为您只想每天更改三个页面的内容,所以这种做法对我来说似乎是合理的。