a标签的用法
a标签可以用来跳转到一个地址,包括外部页面或内部锚点以及邮箱或者电话等
a标签有3个常用属性
1. herf属性可以输入一个网址,并可以访问,常用取值有以下几钟:
- xxxxx.com
- xxxxx.com
- //xxxxx.com
- /a/b/c以及a/b/c
- index.html以及./index.html
- javascript:代码;(伪协议,用来做点击之后没有动作的一个标签)
- mailto:邮箱(链接到邮箱)
- tel:手机号(拨出电话)
- herf=#xxx(跳转到指定id所在标签位置)
2. target属性可以指定在哪个页面打开超链接,常用取值有以下几种:
- _blank(新建页面打开)
- _top(顶部页面打开)
- _parent(父级页面打开)
- _self(当前页面打开)
额外介绍了iframe标签(用来制作内嵌窗口)
3. download属性可以用来下载页面,但是请注意,不是所有浏览器都支持
img标签的用法
img标签可以发出一个get请求,用来展示一张图片
img标签有以下几种常用取值:
- alt(图片加载失败后显示的内容)
- height(定义图片的高)
- width(定义图片的宽)
- src(图片的地址)
img标签还有两个重要事件:
- onload/onerror(可以用来监控图片加载成功/失败,常用于制作图片加载失败后的补救)
除此之外,img标签还有两个重点:
可加入以下响应式,可以让页面在手机显示时固定最大宽度100%
max-width:100%
请注意img标签是一个可替换元素
table标签的用法
table标签可以建立一个表格
table相关标签有以下几种:
- table(插入一个表格)
- thead(表头部分)
- tbody(主体内容部分)
- tfoot(可有可无,表格底部部分)
- tr(表示行)
- td(表示列)
- th(表示表头内容)
table还有以下几种相关样式:
- table-layout(自动计算调整行列间距)
- border-collapse(可以用来合并单元格间距)
- border-spacing(用于调整单元格之间的间隙)
form标签的用法
可以发出get或者post请求,然后刷新页面
form有以下几种属性:
- action(用来控制请求哪个页面)
- method(用来控制是用get还是post来请求页面)
- autocomplete(是否自动给填充记录数据,即下拉建议其他项)
- target(可以选择在哪个页面进行新的请求)
请注意form里的input必须要有name
form里要放一个type=submit才能触发submit事件
input标签的用法
input标签可以让用户输入内容
input有以下常用的类型(type):
- color(颜色)
- checkbox(多选)(如果想让其位于同一组,需给其赋予同一个name)
- hidden(隐藏内容)
- password(密码)
- radio(单选)(单选时需要给其设置在同一个name下)
请注意button中可以添加其他标签,而input内只能有纯文本
学习感想:html还有很多其他标签,类如:
- canvas
- audio
- video
- svg
但是这些标签html没有办法完整控制,而且兼容性需要查看文档,在课下我也会继续学习