我正在尝试为我们的团队创建一个简单的网页。 到目前为止,我已在主页中创建了3个链接(简称:Page1),点击Page1中的每个链接将带我到一个新页面(Page2,Page3和Page4)。第2页,第3页和第4页将包含每日更改的每日团队状态报告,但其文件名将保持不变。我会手动删除旧的并每天放入新的。只有Page1将保持不变,这基本上只用于导航到上述3页。
现在,在Page2,Page3和Page4的每一个中,我试图在页面顶部显示3个链接(指向第2,3和4页的链接)。 这可以在不对Page2,Page3和Page 4进行任何更改的情况下完成(因为这意味着我必须每天进行更改)?可以通过向Page1单独添加一些代码来完成吗
答案 0 :(得分:2)
如果您真的想在一个地方使用链接的HTML,我建议您使用服务器端编程语言。
假设您有四种不同的(静态,无服务器端编程)HTML文件,例如主页为page1.html
,page2.html
,page3.html
和{{1} }。
因此,由于文件名保持不变,您可以在所有四个HTML文件中为链接放置相同的HTML标记。现在您应该使用CSS以您喜欢的方式设置链接的样式。这个CSS进入另一个文件,例如`styles.css'。
page4.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>
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>
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文件中执行相同的更改。但是你只需要在一个地方负责布局的代码。
因为您只想每天更改三个页面的内容,所以这种做法对我来说似乎是合理的。