写一个html页面要求里面有十个分为两组的按键展示效果,每个组件都有相应的超链接
时间: 2024-04-09 08:32:27 浏览: 90
以下是一个满足你要求的HTML页面示例:
```html
<!DOCTYPE html>
<html>
<head>
<title>Button Showcase</title>
<style>
.button-group {
display: flex;
justify-content: center;
margin-bottom: 20px;
}
.button {
padding: 10px 20px;
margin: 0 10px;
background-color: #eee;
border: none;
border-radius: 5px;
text-decoration: none;
color: #333;
font-weight: bold;
}
</style>
</head>
<body>
<div class="button-group">
<a href="#" class="button">Button 1</a>
<a href="#" class="button">Button 2</a>
<a href="#" class="button">Button 3</a>
<a href="#" class="button">Button 4</a>
<a href="#" class="button">Button 5</a>
</div>
<div class="button-group">
<a href="#" class="button">Button 6</a>
<a href="#" class="button">Button 7</a>
<a href="#" class="button">Button 8</a>
<a href="#" class="button">Button 9</a>
<a href="#" class="button">Button 10</a>
</div>
</body>
</html>
```
在这个示例中,有两个按钮组(`button-group`),每个组包含5个按钮(`button`)。每个按钮都是一个超链接(`<a>`元素),并且使用CSS样式进行了样式美化。你可以根据需要自定义样式和链接目标。
阅读全文