标题标签

• <h1>-<h6>
• 文字加粗
• 字号由h1-h6依次减小
• 独占一行

段落标签

• <p>
• 独占一行
• 段落之间存在间隙

换行标签

<br>

水平线(分割线)

<hr>

图片标签

<img src="img/2.jpg(图片位置)" 
    width="100%(图片宽度)" 
    height="100%(图片高度)" 
    alt="令狐冲(图片无法加载的时候显示的文字)" 
    title="鼠标悬停在图片上显示的文字"></img>

音频标签

<audio src="mp3/唐人.mp3" controls loop autoplay></audio>
<!-- controls显示音频控制面板 loop循环播放 autoplay自动播放 -->

视频标签

<video src="video/news.mp4" 
    controls
    loop
    muted (静音播放)
    autoplay 
    width="100%" (视频宽度和高度,二选一设置一个即可)
    height="100%" ></video>

超链接标签

<a href="http://www.cctv.com/",target="_blank">央视网</a>
<!-- target如果是_self,那就是本窗口打开;如果是_blank,那就是新窗口打开-->

文本格式化标签

具有强调语义:
<strong> 加粗
<em> 倾斜
<ins> 下划线
<del> 删除线

没有强调语义:
<b> 加粗
<i> 倾斜
<u> 下划线
<s> 删除线

表格

<table>定义表格
    <tr>定义一行
        <th>这是一行中的一个元素,h代表表头
        <th>
        <th>
        <th>一行总共四个
    </tr>
    <tr>
        <td>
        <td>
        <td>
        <td>
    </tr>
</table>

表单(form)

<form class="search-form" action="/search" method="post"></form>
<!-- action是表单数据提交的url地址,method是表单数据的提交方式,get数据会被显示在url地址栏中,post数据不会显示在地址栏中-->

<!--在HTML表单中，表单控件（如input、select、textarea等）如果要将其数据提交到服务器，通常必须要有name属性-->
<form>
  <input type="text" name="username" value="张三">
  <input type="email" name="email" value="zhangsan@example.com">
  <button type="submit">提交</button>
</form>
<!-- 提交的数据会是：username=张三&email=zhangsan@example.com -->

input为输入框,input type有:

• text 文本框
• password 密码框
• number 数字框
• email 邮箱框
• url 网址框
• date 日期框
• time 时间框
• datetime-local 日期时间框
• month 月份框
• week 周框
• color 颜色框
• checkbox 复选框
• radio 单选框
• file 文件上传
• hidden 隐藏域

input type属性:

• name 表单元素的名称,可理解为提交时的键
• value 表单元素的值,可理解为提交时的值
• placeholder 表单元素的提示文本
• required 表单元素是否必填
• disabled 表单元素是否禁用
• readonly 表单元素是否只读
• multiple 表单元素是否多选
• autofocus 表单元素是否自动获取焦点
• min 表单元素的最小值
• max 表单元素的最大值
• step 表单元素的步长
• patten 表单元素的正则表达式
• list 表单元素的数据列表
• autocomplete 表单元素的自动完成

select为下拉框:

<label for="gender-select">性别:</label><!--这行代码的作用是方便用户勾选-->
  <select class="gender-select">
    <option value="">请选择性别</option>
    <option value="男" selected>男</option><!--selected代表默认选中-->
    <option value="女">女</option>
  </select>

button为按钮:

<!-- 如果不指定type，默认为submit -->
<button type="submit">提交表单</button>
<button>这也是提交按钮</button>

<button type="reset">重置表单</button>

<button type="button">普通按钮</button>
<!--通常绑定JavaScript事件-->

label:

<!--label元素的for属性用于将标签与表单控件关联起来,增加表单的单击面积-->
<label for="gender-select">性别:</label>
  <select id="gender-select">
    <option value="">请选择性别</option>
    <option value="男">男</option>
    <option value="女">女</option>
  </select>

无语义标签

<div>独占一行,宽度默认是父元素的宽度,高度默认由内容撑开,可以设置宽高
<span>不换行,宽度高度默认由内容撑开,不可以设置宽高

字符实体

空格:&nbsp
< : &lt
> : &gt