写个HTMLbutton按钮
时间: 2023-05-28 11:05:47 浏览: 57
<!DOCTYPE html>
<html>
<head>
<title>HTML Button</title>
</head>
<body>
<button>Click me</button>
</body>
</html>
相关问题
html两个button按钮并排
可以使用 CSS 中的 `display: inline-block;` 属性将两个按钮水平排列。以下是一个示例代码:
```html
<div>
<button>Button 1</button>
<button>Button 2</button>
</div>
```
```css
button {
display: inline-block;
margin-right: 10px; /* 可以根据需要调整按钮之间的间距 */
}
```
在上述代码中,我们使用一个 `div` 元素包裹了两个按钮,并将按钮的 `display` 属性设置为 `inline-block`,这样它们就可以水平排列。同时,我们还可以通过设置 `margin-right` 属性来调整按钮之间的间距。
写一个利用button按钮播放音乐的html
<html>
<head>
<title>播放音乐</title>
</head>
<body>
<button onclick="playMusic()">播放音乐</button>
<audio id="music" src="music.mp3"></audio>
<script>
function playMusic() {
var music = document.getElementById("music");
music.play();
}
</script>
</body>
</html>
这个例子中,我们创建了一个播放音乐的 button 按钮,并在点击按钮时调用 JavaScript 函数 playMusic()。该函数通过 document.getElementById() 方法获取 id 为 music 的 audio 元素,使用 play() 方法播放音乐。其中,音乐文件 music.mp3 需要放在与 HTML 文件同一目录下。
相关推荐
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)