HTML内容标签

1. ol+li（ordered list+list item）有顺序的列表
2. ul+li（unordered list +list item）无序列表
3. dl+dt+dd（description list +term+ data）描述列表 dl 列表，dt 一个词，dd 描述内容
4. pre（preview 的缩写）如果你想保留空格、回车用 pre 包裹起来
5. hr 水平分割线
6. br（break 的缩写）中断换行
7. a（anchor 的缩写） 超级链接
8. em（emphasis 的缩写） 强调
9. strong 重要 加粗
10. code 等宽字体
11. q（quote 的缩写） 内敛的引用
12. blockquote 换行的引用

常用的内容标签有哪些，分别是什么意思（a、strong、em、code、pre 等等）及作用

a标签的作用有以下三种

1. 跳转外部页面
2. 跳转内部锚点
3. 跳转到邮箱或电话等

a 标签 常用的属性有三个

一、 href 超级链接/引用

1. 预览有两种打开方式：
   • 安装 yarn global add http-server，然后用 http-server . -c-1（-c缓存-1 不要缓存的意思）点击链接然后加上路径来预览。
   • 安装 yarn global add parcel 然后运行 parcel a-href.heml
2. a 的 href 的取值
   • 网址 //google.com
   • 路径 /a/b/c
   • index.html以及./index.html
3. 伪协议
   • javascript:; 伪协议，现在的作用是写一个点击没有动作的伪协议
   • mailto:邮箱
   • tel:手机
4. id href=#xxx

二、 target 我要在哪个窗口打开超链接

1. _self 默认值在当前打开
2. _top 在最顶层打开
3. _blank 新窗口打开
4. _parent 在当前链接所在的 iframe 打开

三、 download 下载网页，其实好多不支持。

四、rel=noopener 防止一个 bug 后期学 js 再学这个

atable 标签 表格

1. table 目前常用的标签只有下面三个

   <table>
     <thead></thead> 表头
     <tbody></tbody> 中间
     <tfoot></tfoot> 尾部
   </table>
   

2. tr 意思是 table row table 里面的一行

3. td 数据

4. th 表头 table 相关的样式

5. table-layout CSS 属性定义了用于布局表格单元格，行和列的算法。auto 根据表格里面文字多少决定表格宽度，fixed 意思是等宽

6. border-collapse 控制 border 是否合并

7. border-spacing 控制 border 的距离正常改为 0

image 标签 图片

1. 作用：img 标签会发出 get 请求，展示一张图片
2. 属性：alt，当图片加载失败用户能够知道展示的是什么，height，width，只写高度或者宽度他会自适应高或者宽，前端工程师切记不能让图片变形！！！ src 图片地址
3. 重要事件：如果图片加载成功显示 onload ，如果加载失败显示 onerror。这个功能主要是万一图片加载失败可以挽救
4. 响应式： max-width:100% 满足手机图片最大宽度

form 标签 表格

1. 作用：发 get 或 post 请求，然后刷新页面 。
2. 属性：
   • action 里面写什么点击之后就能请求哪个页面，
   • autocomplete 是否自动填充
   • method 是控制 get 或者 post
   • target 告诉浏览器我要提交那页面，哪个页面应该刷新。
3. 事件：onsubmit
   • onsubmit 当用户点提交的时候就会触发这个事件，form 里面必须有一个 type="submit",如果不写默认会有一个。
   • input type=“submit”只能文本不能有任何内容标签
   • button type=“submit”可以有任何标签。

input 标签

1. 作用：让用户输入内容
2. 属性：见下列常见代码

<input type="text" />默认的是个普通文本
<input type="color" />还可以是个颜色
<input type="password" />隐藏的圆点，通常用于隐藏密码
<input name="gender" type="radio" />男 单选
<input name="gender" type="radio" />女 单选
<input type="checkbox" />唱歌  多选
<input type="checkbox" />跳舞  多选
<input type="checkbox" />打架  多选
<input type="file" /> 上传图片
<input type="file" multiple />可以选张图片
<input type="hidden" /> 看不见的input是给JS获取字符串的
<textarea style="resize: none;width:50%; height: 300px;"></textarea>多行文本，需设置不让它拖动
<select> 选择
        <option value="">-请选择-</option>
        <option value="1">星期一</option>
 </select>

后续在更新！