写一个由图片和文字构成的网页代码
时间: 2024-02-19 12:58:09 浏览: 32
以下是一个简单的 HTML 代码示例,用于创建一个由图片和文字构成的网页:
```html
<!DOCTYPE html>
<html>
<head>
<title>图片和文字网页</title>
</head>
<body>
<header>
<h1>欢迎来到我的网页</h1>
</header>
<main>
<section>
<h2>图片和文字</h2>
<p>这是一段文字。这是一张图片:</p>
<img src="图片地址" alt="图片描述">
</section>
<section>
<h2>更多图片和文字</h2>
<p>这是另一段文字。这是另一张图片:</p>
<img src="另一张图片地址" alt="另一张图片描述">
</section>
</main>
<footer>
<p>版权所有 © 2021 我的网页</p>
</footer>
</body>
</html>
```
注释:
- `<!DOCTYPE html>`:声明文档类型为 HTML5。
- `<html>` 和 `</html>`:HTML文档的开始和结束标签。
- `<head>` 和 `</head>`:包含页面的元数据,如标题、CSS 和 JavaScript。
- `<title>` 和 `</title>`:定义网页标题。
- `<body>` 和 `</body>`:包含页面的主要内容。
- `<header>` 和 `</header>`:包含网页的页眉。
- `<main>` 和 `</main>`:包含网页的主要内容。
- `<section>` 和 `</section>`:划分网页的不同部分。
- `<h1>` - `<h6>`:定义不同级别的标题。
- `<p>` 和 `</p>`:定义段落。
- `<img>`:插入图片。
- `src`:图片的文件路径或 URL。
- `alt`:当图片无法显示时,显示的替代文本。
- `<footer>` 和 `</footer>`:包含网页的页脚。
这只是一个简单的示例,您可以根据需要添加更多的元素和样式来创建一个更复杂和美观的网页。
相关推荐
![](https://img-home.csdnimg.cn/images/20210720083646.png)
![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)
![](https://img-home.csdnimg.cn/images/20210720083646.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)