html编写一首古诗,要求有css和js
时间: 2024-03-09 14:08:36 浏览: 110
好的,以下是一首古诗的HTML代码,同时加入了CSS样式和JS脚本:
```html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>一首古诗</title>
<style>
h1 {
color: #330066;
font-size: 24px;
text-align: center;
margin-top: 20px;
}
p {
font-size: 18px;
line-height: 1.5;
margin: 10px 0;
text-indent: 2em;
}
#btn {
display: block;
margin: 20px auto;
padding: 10px 20px;
background-color: #330066;
color: #fff;
border: none;
border-radius: 5px;
cursor: pointer;
}
</style>
<script>
function showAlert() {
alert("这是一首了不起的古诗!");
}
</script>
</head>
<body>
<h1>登高</h1>
<p>风急天高猿啸哀,</p>
<p>渚清沙白鸟飞回。</p>
<p>无边落木萧萧下,</p>
<p>不尽长江滚滚来。</p>
<p>万里悲秋常作客,</p>
<p>百年多病独登台。</p>
<p>艰难苦恨繁霜鬓,</p>
<p>潦倒新停浊酒杯。</p>
<button id="btn" onclick="showAlert()">点我欣赏</button>
</body>
</html>
```
其中,CSS样式设置了标题和段落的字体、颜色、行距等样式,同时设置了一个按钮样式;JS脚本定义了一个弹窗函数,点击按钮后触发该函数弹出提示框。希望这份代码能够满足您的需求!
阅读全文