HTML <a> href 属性

HTML <a> 标签

定义和用法

href 属性规定链接指向的页面的 URL。

href 属性的值可以是任何有效文档的相对或绝对 URL，包括片段标识符和 JavaScript 代码段。如果用户选择了 <a> 标签中的内容，那么浏览器会尝试检索并显示 href 属性指定的 URL 所表示的文档，或者执行 JavaScript 表达式、方法和函数的列表。

如果 href 属性不存在，则 <a> 标签将不是超链接。

Panduan:您可以使用 href="#top" 或 href="#" 链接到当前页面的顶部！

制作文本链接

一个引用其他文档的简单 <a> 标签可以是下列形式：

<a href="http://www.codew3c.com/index.html">CodeW3C.com 在线教程</a>

Browser akan menunjukkan frasa 'CodeW3C.com Eksperimen Dalam Talian' (biasanya teks biru dengan garisan bawah), supaya pengguna tahu ia adalah pautan yang boleh dihubungkan ke dokumen lain. Seperti seperti ini:

CodeW3C.com 碧程教程

Pengguna boleh menggunakan pilihan dalam browser untuk menentukan warna teks sendiri, menetapkan warna teks untuk pautan sebelum dan selepas pautan.

Panduan:Dapat digunakan Pseudo-kelas CSSMenambahkan gaya yang kompleks dan beragam kepada pautan teks.

Buat pautan imej

Anchor yang lebih kompleks boleh mengandungi imej. Logo di bawah adalah pautan imej, klik imej itu, anda akan pulang ke laman utama W3school:

<a href="http://www.codew3c.com/index.html">
<img src="/i/codew3c_logo_white.gif" />
</a>

Kod di atas akan menambahkan pautan utama ke laman utama CodeW3C.com:

CodeW3C.com 碧程教程

Bbrowser grafik kebanyakan akan menempatkan border khusus di sekeliling imej yang berkhidmat sebagai sebahagian daripada anchor. Dengan memasukkan imej di dalam tag <img> dengan border imej Properti borderDapat diatur 0 untuk menghapus border pautan hyperlink. Juga dapat digunakan Properti border CSSUntuk mengubah gaya border elemen secara global.

Contoh

Contoh 1

Attribute href menentukan tempat tujuan pautan:

<a href="https://www.codew3c.com">Lawat CodeW3C.com</a>

Cuba sendiri

Contoh 2

Bagaimana untuk menggunakan imej sebagai pautan:

<a href="https://www.codew3c.com">
<img border="0" alt="W3School" src="/i/logo/w3logo.png" width="400" height="225">
</a>

Cuba sendiri

Contoh 3

Bagaimana untuk menghubungkan ke alamat email:

<a href="mailto:someone@example.com">Hantar Email</a>

Cuba sendiri

Contoh 4

Bagaimana untuk menghubungkan ke nomor telepon:

<a href="tel:+8613888888888">+86 138 8888 8888</a>

Cuba sendiri

Contoh 5

Bagaimana untuk menghubungkan ke bagian lain di halaman yang sama:

<a href="#section2">Pergi ke Bab ke-2</a>

Cuba sendiri

Contoh 6

Bagaimana untuk menghubungkan ke JavaScript:

<a href="javascript:alert('Hello World!');">Laksanakan JavaScript</a>

Cuba sendiri

Sintaks

<a href="URL">

Nilai sifat

Nilai Deskripsi
URL

URL pautan.

Nilai yang mungkin:

  • URL yang absolut - mengarah ke laman lain (contohnya href="http://www.example.com/index.html")
  • URL yang relatif - mengarah ke fail di dalam laman (contohnya href="index.html")
  • Pautan ke elemen yang memiliki id yang ditetapkan di halaman (contohnya href="#section2")
  • Protokol lain (contohnya https://, ftp://, mailto:, file: dll)
  • Skrip (contohnya href="javascript:alert('Hello');")

Dukungan pelayar

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Dukungan Dukungan Dukungan Dukungan Dukungan

HTML <a> 标签