1、<a>标签的用法

定义:元素 (或锚元素) 创建一个到其他网页,文件,同一页面内的位置,电子邮件地址或任何其他URL的超链接。可以跳转到外部页面、内部锚点、邮箱、电话等。

属性:

  • href 表示链接目标的URL或URL片段

href的取值:
1、网址可以有三种表达方式:
https://goole.com
http://goole.com
//goole.com
优先推荐使用第三种表达方式。
2、作为锚点时路径的表示:
/a/b/c和a/b/c
index.html和./index.html
3、伪协议:
JavaScript代码
mailto:邮箱
tel:手机号
4、id
href = #xxxx
一般用法为:<a herf = "">xxx</a>

  • target 该属性指定在何处显示链接的资源

taget的取值一般有以下几种:
1、_blank 表示跳转到一个新的空白窗口
2、_self 表示在 当前页面打开(加载)
3、_top 当有多窗口层级时,加载响应进入顶层(top)窗口
4、_parent 在多窗口下,加载进入该链接的父级窗口
5、由程序员命名:Window的name、iframe的name
一般用法:<a herf = "" target = "">xxx</a>

  • download 此属性指示浏览器下载URL而不是导航到URL,因此将提示用户将其保存为本地文件,但有些浏览器不在支持,尤其是手机可能不支持
  • rel 该属性指定了目标对象到链接对象的关系。该值是空格分隔的列表类型值


2、<img>标签的用法

作用

发出get请求,展示一张图片

属性

  • alt 加载失败,显示alt的元素
  • src 嵌入的图片的文件路径
  • height,width 用于调整图片的高度及宽度。

当只调整图片的宽度或高度时,另一个属性会自适应,将图片调整为与原图等比例的样子。如果同 时调整高度和宽度可能会导致图片变形。
<img src = "" alt = "" height = 123px>

事件

onload/onerror 监听图片是否加载成功,加载成功调用onload,加载失败调用onerror

响应式

max-width:100% 一般用于手机浏览器,使网页能够在手机浏览器上显示的比较好。

可替换元素

img标签是一个可替换元素

3、<table>标签

相关标签

  • table
  • thead
  • tbody
  • tfoot
  • tr table row
  • td table data
  • th 表头

table标签内只有thead,tbody,tfoot三个标签

相关的样式:

table-layout CSS属性定义了用于布局表格单元格,行和列的算法

  • auto 大多数浏览器采用自动表格布局算法对表格布局。表格及单元格的宽度取决于其包含的内容。
  • fixed 表格和列的宽度通过表格的宽度来设置,某一列的宽度仅由该列首行的单元格决定。在当前列中,该 单元格所在行之后的行并不会影响整个列宽。

border-collapse:collapse 合并border
boeder-spacing border间距离

4、其他感想

使用HTML标签时要记住各个标签常用的属性以及书写格式。也要明确各个标签所带有的默认样式。

下附HTML笔记
HTML笔记.pdf