HTML-textlänk - HTML-länkfärger & hur man skapar en ankarkod?

Innehållsförteckning:

Anonim

Introduktion till HTML-textlänk

En HTML-länk kan vara en länk eller en hyperlänk. Detta används för att omdirigera till en annan sida, bild, webbplatser kan det vara vad som helst. De brukade också navigera på samma sida för det specifika avsnittet. De brukade återge data, dokumentera bara genom att klicka på dem. Vi packar bara in våra dokument, bilder, url eller data inuti text. Det kan också peka på en fil, ett objekt eller något på samma sida eller på den olika sidan beror på kravet. När vi håller musen över HTML-länken ändrar den markören till någon annan ikon. Vi kan diskutera hur de fungerar och hur man skapar dem i nästa avsnitt av vår artikel. I det här ämnet kommer vi att lära oss om HTML Text Link.

Syntax för HTML-länk

Vi kan följa för att skapa vår allra första HTML-länk från följande syntax nedan. I den angivna syntaxen nedan kommer vi att använda en annan tagg, attribut och deras motsvarande egenskaper.

Link your corresponding text here

I ovanstående syntax använder vi ankaretiketten för att skapa en html-länk eller en hyperlänk. Vi kommer att diskutera den här ankaretiketten i detalj.

Ankaretiketten är en tagg genom vilken vi kan bifoga eller länka vår text, fras eller ord för att skapa en extern eller intern länk. Genom att använda ankaretiketten skapar vi URL till våra sidor som kan användas för att navigera till någon annan sida, webbplats eller inom samma avsnitt på sidan.

Genom att använda ankaretiketten har vi många fördelar som nämns nedan.

  • Organisera: Det hjälper till att organisera våra data. Vi behöver inte skapa flera webbsidor, behöver inte heller dela upp våra uppgifter i bitar för hanteringsändamål. Vi kan enkelt organisera våra data på ett ställe.
  • Ingen rullning: Genom att använda html-länken eller vi kan säga html-interna länkar behöver vi inte oroa oss för att rulla på riktigt långa sidor kan vi bara klicka på den länken för att hitta önskat avsnitt på samma sida. Så det är enkelt att hitta information eller avsnitt på sidan.

Hur skapar jag ett ankarkod?

Som du kan se i syntaxen ovan har vi använt så många saker där borta nu kommer vi att titta närmare på hur vi skapar och hur det fungerar.

I grund och botten består det av tre olika delar (attribut):

  1. href attribut
  2. målattribut
  3. namnattribut

1. href attribut

Href-attribut står för hypertextreferens. Anta att vi vill skapa en hyperlänk så det första kravet är dokumentadress som kan vara något liknande en annan webbplats, vilken fil som PDF, etc.

So for example : Google

I detta http://www.google.com är det värde vi tilldelar vårt href-attribut. Så när vi klickar på Google kommer det att omdirigera oss till Googles hemsida länk. Därför innehåller href-attributet dokumentadressen. Vi kan också nämna vår egen HTML-länk till href.

Till exempel

My page

2. målattribut

Målattributet definierar hur dokumentet ska öppnas. Det har många typer och vi kan använda dem efter våra behov.

  • _parent: Det öppnar bara det bifogade dokumentet i överordnade ramar.
  • _ blank: Det öppnar dokumentet i den nya fliken eller fönstret.
  • _top: Det öppnar det bifogade dokumentet i hela fönstret.
  • _self: Det öppnar dokumentet i samma fönster eller samma flik där det klickas på. Standarden är detta mål aktiverat. Vi kan ändra det som nedan:

Your Link text

Här target = ”_ blank” är syntaxen för att använda den.

3. namnattribut

Namnattributet används för att hoppa eller navigera till någon punkt på sidan, vilket kan vara användbart när vi har en stor VRU-sida med så många innehåll. Detta hjälper till att spara användarsökning och tid utan att bläddra. Syntax nedan:

or

I denna e klickar du bara för att gå till slutet av sidan utan att bläddra ner.

Section

Den här webbläsaren identifierar avsnittet men vi måste använda (#) med namnattributet.

Link your text

Genom detta kan vi internt hänvisa till ”titeln” på en annan sida. Här måste även (#) användas i slutet av sidans adress.

HTML-länk Färger

Vi kan också tillhandahålla färger till vår html-länk. Som standard har de tre tillstånd för länkfärg, detta kommer att visas i alla webbläsare.

  • Aktiv länk: När vi klickar på en länk blir den en aktiv länk med en understrukad och röd färg.
  • Ovisade länkar: Standardfärg för webbläsarens standardfärg för de ovisade länkarna är blå och understrukna.
  • Besökta länkar: Dessa är lila och understrukna.

Men vi kan också tillhandahålla våra anpassade färger att länka med under syntax. Vi kan följa denna olika typ för att ge färg till vår länk. Men vi använder inline CSS här om du vill att du också kan skapa extern CSS.

  • Ange direkt namnet på färgen.
  • Genom att använda HEX-färgkoden.
  • Genom att använda rgb () och rgba () värden.
  • Genom att använda hsl- och hsla-värden.

Red Link

I detta kan vi direkt specificera färgnamnet i stilattributet. Detta är en inline CSS.

Red color code

Här specificerar vi färgen med hjälp av färgkoder. (HEX-färgkoder)

Red color

Vi kan också använda RGB () -värden för att ange färgen för våra länkar. Vi kan kontrollera färgens opacitet med hjälp av rgb ().

Red color

Vi kan ersätta rbg () med rgba () men vi måste ange det fjärde värdet för transparens och ogenomskinlig.

Red color

Vi kan också använda HSL t färg vår länk. HSL står i princip för nyans, mättnad och ljushet. Vi kan också använda HSLA för att specificera färg men vi måste tillhandahålla ytterligare en parameter i hsla ().

Slutsats - HTML textlänk

Så i Sortera använder vi ankartaggen och dess attribut för att skapa hyperlänken eller länken i HTML. HREF innehåller dokumentets adress, det mål som ansvarar för att hantera dokumentet. Vi kan också färga vår länk med inline eller extern CSS.

Rekommenderade artiklar

Detta är en guide till HTML Text Link. Här diskuterar vi hur man skapar en ankartagg med HTML-länkfärgerna och syntaxen för HTML-länken. Du kan också titta på följande artiklar för att lära dig mer -

  1. HTML Text Editors
  2. Bildlänk i HTML
  3. HTML-formkontroller
  4. Versioner av Html
  5. HTML-ramar
  6. HTML-block
  7. Ställ in en bakgrundsfärg i HTML med exempel