HTML <a> href egenskab

HTML <a> tag

Definering og brug

href Egenskaben definerer URL'en til den side, som linket peger på.

href Værdien for egenskaben kan være en relativ eller absolut URL til en gyldig dokument, herunder fragmentidentifikatorer og JavaScript-kodestykker. Hvis brugeren vælger indholdet af <a>-etiketten, vil browseren forsøge at indhente og vise href egenskabens URL refererer til et dokument, eller en liste over JavaScript-udtryk, metoder og funktioner.

Hvis href Hvis egenskaben ikke findes, vil <a>-etiketten ikke være en hyperlink.

Bemærk:Du kan bruge href="#top" eller href="#" for at linke til toppen af siden!

Opret tekstlinks

En simpel <a>-etiket, der refererer til en anden dokument, kan se sådan ud:

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

Browseren viser sætningen "CodeW3C.com Online教程" med specielle effekter (ofte med blå tekst og understregning), så brugeren ved, at det er et hyperlink, der kan føre til andre dokumenter. Som dette:

CodeW3C.com online tutorial

Brugere kan også bruge browserens indstillinger til selv at specificere tekstfarve, samt farven på teksten før og efter linket.

Bemærk:Du kan bruge CSS pseudo-klasserTilføj komplekse og varierede stilarter til tekst hyperlinks.

Lav et billede link

Mere komplekse ankre kan også inkludere billeder. Denne LOGO er et billede link, hvor du kan klikke på billedet for at returnere til W3school hjemmesiden:

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

Koden vil tilføje et tilbage til startsiden link til CodeW3C.com LOGO:

CodeW3C.com online tutorial

De fleste grafiske browsere vil placere en speciel kant omkring et billede, der er en del af et anker. Ved at sætte billedets border egenskabenSæt til 0 kan fjerne kantlinjen på et hyperlink. Du kan også bruge CSS kantegenskaberkan bruges til at ændre elementets kantstyle globalt.

Eksempel

Eksempel 1

href egenskaben bestemmer destinen for linket:

<a href="https://www.codew3c.com">Besøg CodeW3C.com</a>

Try it yourself

Eksempel 2

Hvordan bruge billeder som links:

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

Try it yourself

Eksempel 3

Hvordan linking til en e-mailadresse:

<a href="mailto:someone@example.com">Send e-mail</a>

Try it yourself

Eksempel 4

Hvordan linking til et telefonnummer:

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

Try it yourself

Eksempel 5

Hvordan linking til en anden del på samme side:

<a href="#section2">Gå til kapitel 2</a>

Try it yourself

Eksempel 6

Hvordan linking til JavaScript:

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

Try it yourself

Syntax

<a href="URL">

Attribute value

Value Description
URL

The URL of the link.

Possible values:

  • Absolute URL - points to another website (such as href="http://www.example.com/index.html")
  • Relative URL - points to a file within the website (such as href="index.html")
  • Link to an element with a specified id in the page (such as href="#section2")
  • Other protocols (such as https://, ftp://, mailto:, file: etc.)
  • Scripts (such as href="javascript:alert('Hello');")

Browser support

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Support Support Support Support Support

HTML <a> tag