Hur man gör en bild i en bild med en länk? Så här lägger du in en länk i en bild

Genom att skapa banners och sidokartor står nybörjare webbansvariga inför ett sådant problem som att infoga en länk i bilden, vilket gör det till en meny ljusare och mer intressant. Men hur man gör det här? Det finns inget lättare om du känner till språket i HTML.

Låt oss ta reda på hur du kan göra denna satsning till verklighet. I den här artikeln kommer vi att erbjuda dig två alternativ för att lösa problemet. En används sällan på grund av att det tar mycket tid och ansträngning, den andra anses välkänd. Vi kommer att diskutera båda sätten.

Där bildlänken används

Innan vi pratar om hur man gör en bild på en bild en länk, ska vi ta reda på var och för vad de används. Det kommer att göra det lättare att förstå vad vi vill ha från bilden.

Bilder-länkar brukar användas som banderoller, med hjälp av reklamteckningar. Ett exempel på detta kan fungera som bilder i samma "VKontakte". Kom ihåg hur många gånger har du någonsin klickat på ett foto där en viss adress var inbäddad? Dessutom används de ganska ofta som menygrupper och samhällen, speciellt om de innehåller speciella poster. Många av sådana bilder finns på andra webbplatser.

Sätt in en länk i bilden

Det enklaste är en bildlänk. Vi pratar om det först. Denna illustration är en klar referens. Det vill säga att klicka på en sådan bild, du kommer att omdirigeras till en ny sida.

Om du vet hur en vanlig länk är inställd med HTML-markup, borde du inte ha problem. Den enda skillnaden är att en bild anges istället för länktexten.

Så, för att utföra planen behöver du själva bilden, hämtas till Internet eller finns på din dator (beroende på om du ska arbeta i online-läge, faktiskt på webbplatsen eller använda redaktörerna).

Vi letar efter bildens adress, vi skriver ner det för att inte glömma det. Också fixa länken som detta foto ska öppna.

Då skriver vi följande: bild - specialkod . En bildlänk är inställd med den.

Således förskrivar vi en länk som visas som en illustration. Helt enkelt och enkelt. Men det här fungerar bara om du tror att det bara borde finnas en länk på den. Och vad om det skulle finnas mer än en? Då går vi vidare till de andra alternativen.

Gör en meny från bilden

Den första metoden utvecklades självständigt under studiet av markningsspråket på webbsidor. Att skapa en sådan meny kan ta ett par timmar.

Denna metod är lämplig för dem som gillar att röra sig med olika redaktörer, eftersom det är ganska jobbigt och tar lite längre tid än att skapa en meny eller ett kort på andra sätt. Det består i att en bild tas, vilken skärs i flera remsor eller rutor. Varje bild är undertecknad och en länk skapas baserat på den, som beskrivs ovan. Vidare i koden på sidan ordnas etiketterna i önskad ordning. Det är allt, frågan om hur man gör en bild på bilden en länk, nästan löst. Men glöm inte det andra alternativet.

Det är att göra en meny med endast en bild, tilldela en referens för varje område av illustrationen. Var inte rädd, det finns inget extremt i detta. Och nu om allt i ordning.

Hur man gör

Låt oss ta en närmare titt på den första metoden.

Till att börja med behöver du kunskap om grafiska redaktörer och HTML. Som en bild för att skapa en länk kommer denna typ av sidlayout att uppmana dig.

Så om du bestämmer dig för att gå på så sätt behöver du en bild och en enkel grafikredigerare som låter dig klippa bilder och lägga in inskriptioner på dem, samt en plats där du kan fylla dem.

Om det här är din egen webbplats - ett vanligt galleri eller ett bibliotek med filer är lämpligt, för "VKontakte" kan det vara ett grupp- eller community-album (helst stängt).

Därefter ska du skära bilden i delar, samtidigt som du kommer ihåg den ordning i vilken delarna kommer. Vi lägger på inskriptionerna och fyller den med servern, vi skriver ner länkarna till varje illustration.

Vi tar koden som nämns ovan och ersätter erforderliga uppgifter där. Då laddar vi upp bilder till webbplatsen exakt i den ordning de ska gå. I det här fallet, om du skär det i remsor, måste du ställa in varje länk från en ny linje, men om du delade fotot i rutor måste du lägga så många länkar i linjen som det finns fyrkanter.

Skapa en webbplatskarta

Så om du inte är nöjd med det första alternativet, och du vill lära dig hur man gör en bild på bilden en länk på ett annat sätt, så kan vi erbjuda dig att utveckla en karta över länkar. Det blir lättare, här kan jag bara få problem med att ställa in parametrar. Varför förstå mer.

Först och främst, kom ihåg att sidokartan kopplas till bilden med kommandot usemap = "# map1, vilket är ordnat i img-taggen. Därför ska du lägga till den andra delen i taggen - usemap =" # map name "när du fyller i bilden på webbplatsen.

Ytterligare markering av bilden i de zoner som länkarna är fästa på görs med hjälp av paret

Observera att när du använder den här typen av kartuppbyggnad ska du ange inte bara länkar, men också deras åtgärdsområden och koordinater. Därefter kommer vi att analysera de grundläggande parametrar som denna tagnam innehar.

Länkalternativ

Så, du har en färdig bildlänk framför dina ögon. HTML gör att du kan förbättra funktionen på denna bild - för att markera ett specifikt område för referens. Allt detta ställs in med hjälp av speciella parametrar, som kommer att diskuteras nu.

Låt oss prata lite om de grundläggande parametrarna för paret

Vidare inom den parade taggen

Den första är form. Med det ställer webmaster in synpunkter på området. Det kan vara:

• Cirkelcirkel;
• Rekt rektangel;
• Polygon - poly;
• Resten av bilden är standard.

Nästa är samordning. Det används för att ställa in koordinaterna för området i pixlar. Ursprunget i detta koordinatsystem är övre vänstra hörnet. Det är där det största problemet ligger - det är inte så lätt att ange koordinater med hjälp av pixlar, speciellt om du inte känner till datorgrafik.

Vi nämner också den ganska välkända href som anger länkens adress.

Och den sista parametern som nämns är nohref. Det indikerar att det angivna omfånget inte är en länk.

Det här är naturligtvis inte en komplett lista över parametrar som kan ställas in på en bildlänk eller karta. Men samtidigt är det tillräckligt att skapa en ljus och färgstark länk eller till och med ett helt system av dem.

tips

Oavsett hur du vill skapa en länkbild är det viktigaste att originalbilden är bra. Försök att välja de ritningar som inte är iögonfallande, irriterar inte med ljusa färger eller mönster. Detta är särskilt viktigt för sidokartan. Du kan göra ett collage av flera bilder, mörka dem eller inkludera ett av filtren i en grafikredigerare.

När du skapar en webbplatskarta rekommenderas att du väljer bilder med mjuka, irriterande mönster. Tro mig, inte alltid nyckeln till framgång är en ljus bild - en länk. VKontakte fokuserar emellertid ofta på ljusstyrkan och flamboyansen för att locka nya besökare.

rön

Låt oss sammanfatta. Vi har funderat på hur man gör en bild på en bild med en länk, och vi tittade på två sätt som du lika framgångsrikt kan använda för att skapa menyer av varierande grad av komplexitet. Dessutom utredde vi hur vi ställer in en länkbild och lärde oss också om de grundläggande parametrarna som gör att du kan skapa en ganska bekväm karta över en webbplats, grupp eller gemenskap.