用html css JavaScript做一个简单的网页
时间: 2024-10-14 19:08:21 浏览: 30
《html+css+javascript 网页制作案例教程》源代码
创建一个简单的网页通常涉及HTML、CSS和JavaScript这三个技术的结合。以下是制作过程的一个简要概述:
1. **HTML (超文本标记语言)**: 是网页的基础结构,用于组织内容。例如,你可以创建一个基本的页面布局如下:
```html
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<title>简单网页</title>
</head>
<body>
<h1>欢迎来到我的网站!</h1>
<p>这是段落文字。</p>
</body>
</html>
```
2. **CSS (层叠样式表)**: 用于美化和布局页面。可以添加一些基本样式,如颜色和字体:
```css
body {
background-color: #f0f0f0;
font-family: Arial, sans-serif;
}
h1 {
color: #333;
text-align: center;
}
p {
line-height: 1.5;
}
```
3. **JavaScript**: 为网页增加交互功能。比如点击按钮显示隐藏信息:
```html
<button onclick="showMessage()">点击这里</button>
<p id="message" style="display: none;">Hello from JavaScript!</p>
<script>
function showMessage() {
document.getElementById("message").style.display = "block";
}
</script>
```
将这三部分组合在一起,你就有了一个简单的动态网页。浏览器会解析HTML,应用CSS样式,然后JavaScript负责处理用户的交互。
阅读全文