a标签用法

作用

  • 跳转到外部页面
  • 跳转到内部锚点
  • 跳转到邮箱或者电话等

属性

  1. href可以接网址 http://baidu.com``https://baidu.com``//baidu.com 建议使用//baidu.com形式该形式会自动寻找可用网址路径 /a/b/c.html /a/b/c abc.html ./abc.html 服务器/本地 网站目录下文件或网址伪协议 JavaScript：代码 mailto:电子邮件地址 tel:手机号码id
  2. target常接 _blank会在新窗口打开该页面_top顶级窗口打开页面_parent父级窗口打开_self 当前原视窗打开
  3. download引导浏览器下载URL并提示用户保存到本地，可以预填充文件名
  4. rel=noopener打开链接但不授予新的浏览上下文的权限一般用于打开不信任链接

img标签用法

作用：发出get请求，展示图片

属性：alt（描述）/height/width/src（图片地址）

事件：onload加载成功/onerror加载失败

响应式：max-width:100%(自适应，图片宽度=屏幕宽度)

可替换元素：用404图片来替换失效图片（面试可能会考）

假设 img的id为demo，可以添加js onerror函数替换失效图片代码为默认图片

table标签用法

table-MDN

tr=table row 列

th=table head 表头

td=table data 表单数据

tfoot=table foot

tbody=table body

一般含有border时 table最好加 border-spacing:0 border-collapse:collapse的CSS对表格进行闭合

表格自适应大小的CSS为table-layout:auto

杂谈

一点SEO想法：网页面对搜索引擎时其实文字占比很大，用户看到图片或者效果会知道这个文章说的是什么，但是搜索引擎的蜘蛛不会，在网站含有大量图片时，甚至图片内容占比大于文字占比，比如一些壁纸站点，图片的alt属性应该充分的利用上，因为蜘蛛是能够爬取到该内容，这样可以让搜索引擎明白这个图片这个文章到底说的是什么。图片的名称也同样会有一定影响，但是普通图床一般都是随机字符重命名图片还是很可惜的。一般作者也很少浪费时间关注这些细节问题。