1. <a>标签
- 作用:跳转外部页面、跳转内部锚点、跳转到邮箱或电话等
- 属性:
-
href: hyper ref(超链接)。href的取值有九种。 `
网址http://xxx.xxx ; xxx.xxx ; //xxx.xxx; 优先使用//xxx.xxx,因为会自动匹配协议选择地址
路径/a/b/c;a/b/c;index.html或者./index.html;
伪协议:href="javascript:xxx;"可执行js代码,如果添加javascript:;,不会执行任何操作,不会刷新网页或者跳转;mailto:xxx@xxx,tel:手机号,可以实现发邮件和打电话的操作
id:href=#xxx实现跳转锚点
-
target:_blank新页面打开 ; _self当前页面打开 ; 顶层窗口打开,字面意思 ; xxx,会打开一个名为xxx的窗口
-
download:下载页面
-
rel=noopener:安全问题,防止后一个页面获取前一个页面的控制权
-
id:可以给标签元素添加id,通过在a标签的href属性中使用"#id"实现锚点的跳转。
-
2. <table>标签
正确用法
<table>
<thead><tr><th></th></tr></thead>
<tbody><tr><td></td></tr></tbody>
<tfoot><tr><td></td></tr></tfoot>
</table>
- 相关的样式:table-layout:auto自动计算宽和高,也可以用fixed,表格和列的宽度通过表格的宽度来设置,某一列的宽度仅由该列首行的单元格决定,一般用auto
- border-collapse:collapse 合并表格的border
- border-spacing: 表格间的距离,初始表格格与格之间有空隙
3. <image>标签
- 发送的是get请求,alt用来在图加载失败时显示
- 对于图片要么修改宽要么修改高,绝对不能改变图片比例
- 加一句css{max-width:100%}可以使图片变为响应式
- 有onload属性和onerror属性,分别在图片加载完成后和图片加载失败时执行xxx
4.<form>标签
- 表单,可用post或者get提交,会刷新页面,需要与type属性设置为submit的input或者button配合使用
- 有action、autocomplete、method、target、onsubmit等常用属性
5.<input>标签
- type属性可以有text、password、radio单选、checkbox多选、file选择文件等,多选文件需要加上multiple,同时实现单选,还需要给每个选项加上相同的name
- 一般不监听input的click事件
- form里面的input要有name
- form里面放一个type=submit才能触发submit事件
6.emmet命令
vscode自带的命令,快速生成html语句