Pridėkite nuorodą į paveikslėlį HTML

Autorius: Christy White
Kūrybos Data: 12 Gegužė 2021
Atnaujinimo Data: 1 Liepos Mėn 2024
Anonim
How To Use An Image As A Link In HTML
Video.: How To Use An Image As A Link In HTML

Turinys

Vienoje HTML kodo eilutėje beveik bet kurioje svetainėje galite pridėti vaizdą, kurį galima spustelėti. Yra du dalykai, kurių jums prireiks, kad šis darbas veiktų. Jums reikalingas vaizdo URL ir svetainės URL.

Žengti

1 metodas iš 2: Parašykite HTML kodą

  1. Sukurkite HTML failą. Atidarykite teksto rengyklę ir sukurkite naują failą. Išsaugokite failą kaip index.html.
      • Galite naudoti bet kurį norimą teksto rengyklę, net paprastus „Windows“ („Notepad“) ir „Mac OS X“ („TextEdit“) teksto redaktorius.
      • Jei norite naudoti teksto rengyklę, skirtą darbui su HTML, spustelėkite čia norėdami atsisiųsti „Atom“, teksto redaktorių, skirtą „Windows“, „Mac OS X“ ir „Linux“.
      • Jei naudojate „TextEdit“, prieš kurdami HTML failą spustelėkite meniu Formatas, tada spustelėkite Padaryti paprastą tekstą. Šis nustatymas užtikrina, kad HTML failas tinkamai įkeliamas žiniatinklio naršyklėje.
      • Tokie teksto procesoriai, kaip „Microsoft Word“, nėra tinkami rašyti HTML, nes jie prideda nematomus simbolius ir formatą, kurie gali sugadinti HTML failą ir padaryti jį neteisingai rodomu žiniatinklio naršyklėje.
  2. Nukopijuokite ir įklijuokite standartinį HTML kodą. Pasirinkite ir nukopijuokite žemiau esantį HTML kodą ir įklijuokite jį į atidarytą index.html.

    a href = "target url"> img src = "image url" /> / a>

  3. Raskite savo vaizdo URL. Suraskite vaizdą žiniatinklyje, dešiniuoju pelės mygtuku spustelėkite jį ir (priklausomai nuo jūsų naršyklės) spustelėkite Kopijuoti vaizdo URL, Kopijuoti vaizdo adresą arba Kopijuoti vaizdo vietą.
      • „Firefox“ ir „Internet Explorer“ naudoja kopijuoti vaizdo vietą. „Chrome“ naudoja kopijuoti vaizdo URL. „Safari“ naudoja kopijuoti vaizdo adresą.
  4. Pridėkite vaizdo URL. Faile index.html spustelėkite ir vilkite, kad pele pasirinktumėte vaizdo URL, tada paspauskite CTRL + V, kad įklijuotumėte URL.
  5. Pridėkite tikslinį URL. Iš index.html ištrinkite tikslinį URL ir įveskite https://www.startpage.com.
      • Kaip tikslinį URL galite naudoti bet kurį URL.
  6. Išsaugokite HTML failą.
  7. Atidarykite HTML failą žiniatinklio naršyklėje. Dešiniuoju pelės mygtuku spustelėkite index.html ir atidarykite šį failą pasirinktoje interneto naršyklėje.
      • Jei naršyklė atsidaro, bet nematote vaizdo, įsitikinkite, kad teisingai parašėte vaizdo failo pavadinimą faile index.html.
      • Kai naršyklė atsidaro, bet vietoj fono paveikslėlio matote HTML kodą, jūsų index.html įrašomas kaip .rtf failas (raiškiojo teksto failas). Pabandykite redaguoti HTML failą kitame teksto rengyklėje.

2 metodas iš 2: supraskite HTML kodą

  1. Supraskite inkaro žymę. HTML kodas susideda iš žymų atidarymo ir uždarymo. „A href =" "> žyma yra pradinė žyma, o / a> yra pabaigos žyma. Tai vadinama inkaro žyma ir naudojama nuorodoms į tinklalapį pridėti.
    • a liepia naršyklei sukurti nuorodą. href yra HTML nuorodos santrumpa, = liepia naršyklei pakeisti viską, kas vyksta ’ ’ sukurti nuorodą. Bet kurį URL galima įdėti tarp dviejų kabučių.
    • / a> praneša naršyklei, kad inkaro žyma uždaryta.
    • Kai tarp teksto pridedate teksto a href = ""> ir / a> tas tekstas tampa spustelėjama nuoroda tinklalapyje. Pavyzdžiui: a href = "https://www.google.com"> Google / a> sukuria nuorodą į „Google“.
  2. Supraskite vaizdo žymą. „Img>“ žyma yra uždara. Galite jį uždaryti naudodami img src = "" /> arba img src = "">> / img>.
    • img žyma nurodo naršyklei rodyti vaizdą. src yra šaltinio santrumpa, de = liepia naršyklei ištrinti viską tarp ’ ’ ir paimkite vaizdą iš tos vietos.
    • /> liepia naršyklei uždaryti atvaizdo žymą.
    • Pvz .: {samp [} gauna vaizdą iš to URL, tada rodo jį žiniatinklio naršyklėje.
  3. Naudokite šį kodą visur. Dabar, kai žinote šį kodą, galite a href = "target url"> img src = "image url" /> / a> norėdami pridėti spustelėjamus vaizdus į bet kurį tinklalapį su HTML kodu.