HTML-<a>-tagi

Määrittely ja käyttö

<a> Tagi määrittää hyperlinkin, joka siirtää yhdestä sivusta toiseen.

<a> Elementin tärkein ominaisuus on href-ominaisuus，se osoittaa linkin kohde.

Oletuksena linkit näyttävät kaikki selaimissa seuraavasti:

  • Vierailemattomat linkit ovat alleviivatut ja siniset
  • Vierailtuja linkkejä ovat alleviivatut ja violetit
  • Vierailtavat linkit ovat alleviivatut ja punaiset

Vinkki:Olet ehkä huomannut, että CodeW3C.com -sivuston sisällä olevien linkkien ulkoasu eroaa merkittävästi oletuslinkkien ulkoasusta. Voit käyttää CSS -skena Lisää monipuolisia ja monimutkaisia stilejä tekstiä yhdistettyihin hyperlinkkeihin.

Katso myös:

HTML oppitunnit:HTML -linkki

HTML DOM viittomakirja:Ankkuri-objekti

CSS oppitunnit:Linkkityyli

Terminologia selitykset

Mikä on hyper teksti?

Esimerkki

Esimerkki 1

Luo linkki kohteeseen codew3c.com:

<a href="https://www.codew3c.com">Avaa codew3c.com!</a>

Kokeile itse

Esimerkki 2

Miten käyttää kuvaa linkkinä:

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

Kokeile itse

Esimerkki 3

Miten avataan linkki uudessa selaimen ikkunassa:

<a href="https://www.codew3c.com" target="_blank">Avaa codew3c.com!</a>

Kokeile itse

Esimerkki 4

Miten yhdistää sähköpostiosoiteen:

<a href="mailto:someone@example.com">Lähetä sähköposti</a>

Kokeile itse

Esimerkki 5

Miten yhdistää puhelinnumeroon:

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

Kokeile itse

Esimerkki 6

Miten linkittää saman sivun toiseen osaan:

<a href="#section2">Siirry toiseen lukuun</a>

Kokeile itse

Esimerkki 7

Miten linkittää JavaScriptiin:

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

Kokeile itse

Vinkit ja huomiot

Vinkki:Jos <a>-tunniste ei ole määritetty href-ominaisuutta, se on vain hyperlinkin paikannin.

Vinkki:Linkitetty sivu näytetään yleensä nykyisessä selaimen ikkunassa, ellei ole määritetty toista kohdetta (target-ominaisuus).

Vinkki:Käytä CSS-asetuksia linkin muodon määrittämiseen:CSS -linkki ja CSS -painike.

Atribuutti

Atribuutti Arvo Kuvaus
download Tiedoston nimi Määrittää, mihin käyttäjä ladataan, kun käyttäjä napsauttaa hyperlinkkiä.
href URL Määrittää linkitetyn sivun URL-osoitteen.
hreflang Kieli koodi Määrittää linkitetyn dokumentin kielen.
media Media-kysely Määrittää, mihin媒介/laite dokumentti on optimoitu.
ping URL-lista Määrittää URL-listan, joka erottuu välilyönnillä, kun linkkiä käytetään, selain lähettää POST-pyynnön, joka sisältää ping-tekstin (taustalla). Yleensä käytetään seurantaan.
referrerpolicy
  • no-referrer
  • no-referrer-when-downgrade
  • origin
  • origin-when-cross-origin
  • same-origin
  • strict-origin-when-cross-origin
  • unsafe-url
 Määrittää, mitä viittausinfoa lähetetään yhdessä linkin kanssa.
rel
  • alternate
  • author
  • bookmark
  • external
  • help
  • license
  • next
  • nofollow
  • noreferrer
  • noopener
  • prev
  • search
  • tag
 Määrittää nykyisen dokumentin ja linkitetyn dokumentin välisen suhteen.
target
Määrittää, missä avataan linkitetty dokumentti.
type Median tyyppi Määrittää linkitetyn dokumentin median tyyppin.

Globaalit attribuutit

<a> Tunniste tukee HTML:n globaalit attribuutit.

tapahtumamäärittelyjä

<a> Tunniste tukee HTML:n tapahtumamäärittelyt.

Oletusarvoiset CSS-asetukset

Useimmat selaimet näyttävät seuraavat oletusarvot: <a> Elementti:

a:link, a:visited {
  color: (sisäinen arvo);
  text-decoration: underline;
  cursor: auto;
}
a:link:active, a:visited:active {
  color: (sisäinen arvo);
}

Selaimen tuki

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Tuki Tuki Tuki Tuki Tuki