<html5>我想创建一个我将在许多页面中使用的按钮</html5>

Question

我有一堆照片，我想用3个按钮制作一系列页面：back，next和Home。无论如何使用类来完成这个？ 我试了一下，这就是提出来的：
HTML

<div id = "back" class="btn_back">

CSS

.btn_back {
background-color:#C00; 
display:block; 
width:110px; 
height: 20px; 
text-align:center, justify; }

Answer 1

好吧，你有按钮！恭喜......现在尝试使用后退和前进按钮。您可以使用html和javascript的组合。

在HTML中，您可以将相关性的链接设置为“next”和“prev”。然而，所有这些都将页面链接在一起，通常用于博客。您将需要使用javascript动态更新每个按钮单击时所执行的操作。

HTML示例：

<link rel="next" href="next_page.html">
<link rel="prev" href="prev_page.html">

JavaScript示例：

var back = document.getElementsById("back")[0];
var next = document.getElementsById("next")[0];
back.onClick = function() { window.location = 'prev_page.html' }
next.onClick = function() { window.location = 'next_page.html' }

但请注意，我提供的HTML和Javascript示例彼此无关。但您可以将window.location设置为由link next和link prev的值定义的变量。到这个时候，你可以谷歌如何做到这一点。

Answer 2

要前进和后退，您需要DOM控制。你可以通过javascript来做到这一点。或者，您可以单独链接每个页面，然后将您带到上一页，然后转发到您看不见的页面。

说这是第2页

<a href="1.html">Back</a>
<a href="home.html">Home</a>
<a href="3.html">Forward</a>

您的问题并不容易回答，因为有很多方法可以解决您的问题。

Answer 3

这绝不是一个动态的答案，但它适用于初学者。以下假设您在第3页。

• 以前
• 家
• 以前

CSS：

ul li {display：inline-block; }

Answer 4

您发布的代码没有（功能上）错误。你还记得包含你的样式表吗？ 如果功能不起作用，那将是javascript问题，而不是CSS，我们需要查看您当前的javascript代码。