1.span标签
<span style="color: red;">hello</span>
用于编写文本,不会换行,span标签之间无空隙,换行后有。
2.h标签
<h1>标题标签</h1> <h2>标题标签</h2> <h3>标题标签</h3> <h4>标题标签</h4> <h5>标题标签</h5> <h6>标题标签</h6>
有h1到h6字体逐渐变小。
3.div
<div>竖着布局标签</div> <div>竖着布局标签</div>
4.p标签
<p>段落标签</p> <p>段落标签</p>
5.a标签
<a href="https://www.baidu.com/" target="aaa">点击跳转</a>
href设置资源路径,target设置打开窗口方式(self本窗口,blank新窗口,窗口名指定窗口)。
6.锚点标签
<a name="aaaa">锚点</a> <a href="#bbbb" style="position: fixed;right: 200px;bottom: 200px;">跳转到h1</a> <a href="#cccc" style="position: fixed;right: 200px;bottom: 150px;">跳转到div</a> <a href="#dddd" style="position: fixed;right: 200px;bottom: 100px;">跳转到p</a>
name设置锚点值
7.图片标签
<img src="img/2.png" alt="这是一张图片">
src引用图片路径,alt图片不能显示时显示其中内容。
8.列表标签
<ul> <li>列表标签</li> <li>列表标签</li> <li>列表标签</li> <li>列表标签</li> </ul> <ol> <li>列表标签</li> <li>列表标签</li> <li>列表标签</li> <li>列表标签</li> </ol>
前一种圆点式,后一种数字式。
9.表格标签
<table border="1"> <tr> <th>id</th> <th>name </th> <th>age</th> <th>sex</th> </tr> <tr> <td>1</td> <td colspan="2">张三</td> <td>男</td> </tr> <tr> <td rowspan="2">2</td> <td>王五</td> <td>20</td> <td>男</td> </tr> <tr> <td>李华</td> <td>20</td> <td>男</td> </tr> </table>
table容器
tr行 td单元格 th加粗居中
border有边框
cellpadding=“10px”单元格填充度
cellspacing=“0”单元格之间间距0表示挨在一起
rowspan 把行合并
colspan 把列合并
10.框架标签
<iframe src="https://www.bilibili.com/" width="200" height="200" frameborder="0"></iframe>
嵌套其他页面
11.音频
<audio src="音频/联盟.mp4" controls></audio>
controls 手动播放 autoplay 自动播放 loop 循环播放
12.视频
<video src="音频/联盟.mp4" width="200px" height="200px" controls></video>
controls 手动播放 autoplay 自动播放 loop 循环播放
12.收集用户信息标签
<form> <input type="text">单行文本框<br><br> <input type="password">密码框<br><br> <input type="radio" name="sex">男生 <input type="radio" name="sex">女生 单选框<br><br> <input type="checkbox">篮球 <input type="checkbox">乒乓球 <input type="checkbox">足球 复选框<br><br> <input type="file">文件选择<br><br> <input type="color">颜色拾取器<br><br> <input type="date">日期<br><br> <input type="datetime-local">日期时间<br><br> <input type="week">周选择器<br><br> <input type="range" min="0" max="100" value="90">滑块<br><br> <input type="number" min="0" max="100" value="10" step="5">数字<br><br> <select> <option value="">数学</option> <option value="">语文</option> <option value="">英语</option> </select> <textarea rows="10" cols="50"></textarea>多行文本域 <input type="button" value="普通按钮"> <input type="reset" value="重置按钮"> <input type="submit" value="提交按钮"> </form>