創建一個單頁網站。
提示
用戶
制作一個單頁網站,展示不同的JavaScript特性,如下拉菜單和信息展示等。網站應該是一個嵌入了JavaScript和CSS的HTML文件。
樣本響應
```html
<!DOCTYPE html>
<html>
<head>
<title>JavaScript 特性</title>
<style>
body {
font-family: Arial, sans-serif;
}
.dropdown {
position: relative;
display: inline-block;
}
.dropdown-content {
display: none;
position: absolute;
background-color: #f9f9f9;
min-width: 160px;
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
padding: 12px 16px;
z-index: 1;
}
.dropdown:hover .dropdown-content {
display: block;
}
</style>
</head>
<body>
<h1>JavaScript 特性</h1>
<div class="dropdown">
<button>鼠标懸停在我上面</button>
<div class="dropdown-content">
<p>你好,世界!</p>
</div>
</div><h2>JavaScript 警告</h2>
<button onclick="displayAlert()">點擊我</button><h2>JavaScript 日期</h2>
<p id="date"></p><script>
function displayAlert() {
alert("你好,這是一個 JavaScript 警告!");
}document.getElementById("date").innerHTML = "今天的日期是 " + new Date().toDateString();
</script>
</body>
</html>
```
這是一個簡單的單頁網站,演示了幾個JavaScript特性:1. 當你将鼠标懸停在按鈕上時會出現一個下拉菜單。這是使用CSS實現的懸停效果和HTML實現的結構。
2. 當你點擊按鈕時會觸發一個JavaScript警告。這是一個簡單的演示,展示了JavaScript如何與HTML元素交互。
3. 一個顯示當前日期的JavaScript函數。這是一個例子,展示了JavaScript如何操作HTML内容。
API 請求
{
"model": "gpt-4",
"messages": [
{
"role": "user",
"content": "Make a single page website that shows off different neat javascript features for drop-downs and things to display information. The website should be an HTML file with embedded javascript and CSS."
}
],
"temperature": 0,
"max_tokens": 2048
}
评论