<header>、<nav>、<main>、<footer>
时间: 2023-12-15 19:06:13 浏览: 37
<header>、<nav>、<main>、<footer>都是HTML5中的新标签,用于更好地组织和语义化网页内容。
<header>标签用于定义文档的头部区域,通常包含网站的标题、logo、导航栏等内容。
<nav>标签用于定义导航链接的容器,通常包含网站的主要导航链接。
<main>标签用于定义文档的主要内容区域,一个文档中只能有一个<main>标签,且不能是以下元素的后代:<article><aside>、<footer>、<header>或<nav>
<footer>标签用于定义文档的底部区域,通常包含版权信息、联系方式等内容。在<footer>元素内的联系信息应该位于<address>标签中。
相关问题
下列哪些标签可以用于定义一个网站的整个页面结构 A、<header> B、<main> C、<footer> D、<body> E、<html> F、<nav>
可以用以下标签来定义一个网站的整个页面结构:
- <html>:定义 HTML 文档。
- <head>:定义文档头部,包括文档的元数据。
- <body>:定义文档主体,包括所有可见的内容。
- <header>:定义文档或节的页眉。
- <main>:定义文档的主要内容。
- <footer>:定义文档或节的页脚。
- <nav>:定义导航链接的部分。
<!DOCTYPE html> <html> <head> <title>招聘网</title> <meta charset=“utf-8”> <meta name=“viewport” content=“width=device-width, initial-scale=1.0”> <link rel=“stylesheet” type=“text/css” href=“style.css”> </head> <body> <header> <div class=“container”> <h1>招聘网</h1> <nav> <ul> <li><a href=“#”>首页</a></li> <li><a href=“#”>职位列表</a></li> <li><a href=“#”>公司介绍</a></li> </ul> </nav> </div> </header> <main> <div class=“container”> <section class=“job-list”> <h2>最新职位</h2> <ul> <li> <h3>前端工程师</h3> <p>公司名称:XXX公司</p> <p>工作地点:上海</p> <p>薪资范围:10k-15k</p> <a href=“#”>查看详情</a> </li> <li> <h3>后端工程师</h3> <p>公司名称:XXX公司</p> <p>工作地点:北京</p> <p>薪资范围:12k-18k</p> <a href=“#”>查看详情</a> </li> </ul> </section> <section class=“company-info”> <h2>公司介绍</h2> <p>公司名称:XXX公司</p> <p>公司规模:100人以上</p> <p>公司地址:上海市XXX路XXX号</p> <a href=“#”>查看详情</a> </section> </div> </main> <footer> <div class=“container”> <p>版权所有 © 招聘网</p> </div> </footer> </body> </html>帮我在职位列表加入多选框
好的,可以在职位列表的每个职位信息下方加入多选框,代码如下:
```
<li>
<h3>前端工程师</h3>
<p>公司名称:XXX公司</p>
<p>工作地点:上海</p>
<p>薪资范围:10k-15k</p>
<label>
<input type="checkbox" name="job[]" value="frontend">选择
</label>
<a href="#">查看详情</a>
</li>
<li>
<h3>后端工程师</h3>
<p>公司名称:XXX公司</p>
<p>工作地点:北京</p>
<p>薪资范围:12k-18k</p>
<label>
<input type="checkbox" name="job[]" value="backend">选择
</label>
<a href="#">查看详情</a>
</li>
```
在每个职位信息下方加入了一个 `label` 元素,里面包含了一个多选框 `input` 元素。`name` 属性设置为 `job[]`,这样多选框的值就可以通过 PHP 的 `$_POST['job']` 数组获取到。`value` 属性可以设置多选框的值,这里设置为 `frontend` 和 `backend`。
相关推荐
![](https://img-home.csdnimg.cn/images/20210720083646.png)
![doc](https://img-home.csdnimg.cn/images/20210720083327.png)
![](https://img-home.csdnimg.cn/images/20210720083646.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)