HTML的常用标签

272 阅读3分钟

一、a标签的用法

1.1 什么是a标签

a标签(或称锚元素)可以创建通向其他网页、文件、同一页面内的位置、电子邮件地址或任何其他 URL 的超链接。

1.2 a标签的样式

<a href=""></a>

1.3 a 标签的属性

  • href
  • target
  • download
  • id

1.3.1href

"href"即"hype reference",中文直译为超链接,包含超链接指向的 URL 或 URL 片段。 URL 片段是哈希标记(#)前面的名称,哈希标记指定当前文档中的内部目标位置(HTML 元素的 ID)。URL 不限于基于 Web(HTTP)的文档,也可以使用浏览器支持的任何协议。例如,在大多数浏览器中正常工作的file:、ftp:和mailto:

常见网站样式有:

 <a href="http://google,com" >网站1</a>
 <a href="https://google,com">网站2</a>
 <a href="//google,com">网站3</a>

路径:

  • /a/b/c以及a/b/c
  • index.html和./index.html

其中绝对路径/a/b/c中的的“/”并不是我们硬盘的根目录,而是我们http服务的根目录; 而相对路径a/b/c就是指我们当前目录下;

伪协议

  • javascript伪协议;
  • mailto:邮箱
  • tel:手机号

其中JavaScript伪协议早期用于执行js,目前用于点击之后没有动作的a标签;

二、img标签的用法

2.1 什么是img标签

将一份图像嵌入文档。

  1. img标签的格式
 <img src="" alt="">
  • src 属性是必须的,它包含了你想嵌入的图片的文件路径。
  • alt 属性包含一条对图像的文本描述,这不是强制性的,但对可访问性而言,它难以置信地有用——屏幕阅读器会将这些描述读给需要使用阅读器的使用者听,让他们知道图像的含义。如果由于某种原因无法加载图像,普通浏览器也会在页面上显示alt 属性中的备用文本:例如,网络错误、内容被屏蔽或链接过期时。
  1. 事件
  • noload加载成功
  • onerror加载失败

发生加载失败的原因 如果在加载或渲染图像时发生错误,且设置了至少一个 onerror 事件处理器来处理 error 事件,那么设置的事件处理器就会被调用。这样的错误可能发生在各种不同的情况下,包括:

src 属性的属性值为空("")或者 null。 src 属性的 URL 和用户正在浏览的页面的 URL 完全相同。 图像出于某些原因损坏了,从而无法加载。 图像的元数据被破坏了,无法检索它的分辨率/宽高,而且在 元素的属性中没有指定宽度和/或高度。 用户代理尚未支持该图片所用的格式。 备注:加载失败时,我们常用一个备份的图片用于加载失败时的替代。(保证页面的贞洁美观)

三、table标签的用法

2.1 什么是table标签

table的用法比较简单,所包含的属性,基本已经被废弃。规则应该使用 CSS 定义和设计样式。

下面是一个table的简单的例子


   <table>
      <thead>
        <tr>
          <th></th>
          <th>星期一</th>
          <th>星期二</th>
        </tr>
      </thead>
      <tbody>
        <tr>
          <th>语文</th>
          <td>8:00</td>
          <td>8:00</td>
        </tr>
        <tr>
          <th>语文</th>
          <td>8:00</td>
          <td>8:00</td>
        </tr>
      </tbody>
      <tfoot>
        <tr>
          <td></td>
        </tr>
      </tfoot>
    </table>
    

总结:html本身并不难,标签由创立之初的18个到目前的110多个发展非常迅速,掌握基本常用的标签即可,不会使用的标签可以自行网上搜索,细心输入、闭合便不会有很大的问题,但现在许多属性都已经淘汰,规则应该使用css定义和设计样式,