Magdagdag ng isang link sa isang imahe sa HTML

May -Akda: Christy White
Petsa Ng Paglikha: 12 Mayo 2021
I -Update Ang Petsa: 1 Hulyo 2024
Anonim
how to make a link in html | html tutorial
Video.: how to make a link in html | html tutorial

Nilalaman

Sa isang solong linya ng HTML code, maaari kang magdagdag ng isang nai-click na imahe sa halos anumang website. Mayroong dalawang bagay na kakailanganin mo upang maisagawa ito. Kailangan mo ng isang URL para sa imahe at pati na rin ang URL ng isang website.

Upang humakbang

Paraan 1 ng 2: Isulat ang HTML code

  1. Lumikha ng isang HTML file. Magbukas ng isang text editor at pagkatapos ay lumikha ng isang bagong file. I-save ang file bilang index.html.
      • Maaari mong gamitin ang anumang text editor na gusto mo, kahit na ang mga simpleng editor ng teksto ng Windows (Notepad) at Mac OS X (TextEdit).
      • Kung nais mong gumamit ng isang text editor na inilaan para sa pagtatrabaho sa HTML, mag-click dito upang i-download ang Atom, isang text editor para sa Windows, Mac OS X at Linux.
      • Kung gumagamit ka ng TextEdit, i-click ang Format menu bago likhain ang HTML file, pagkatapos ay i-click ang Gumawa ng Plain Text. Tinitiyak ng setting na ito na ang HTML file ay naglo-load nang tama sa isang web browser.
      • Ang mga nagpoproseso ng salita tulad ng Microsoft Word ay hindi talaga mabuti para sa pagsulat ng HTML, sapagkat nagdaragdag sila ng hindi nakikitang mga character at pag-format na maaaring masira ang HTML file at mai-render ito nang maling ipinakita sa isang web browser.
  2. Kopyahin at i-paste ang karaniwang HTML code. Piliin at kopyahin ang HTML code sa ibaba at i-paste ito sa iyong binuksan na index.html.

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

  3. Hanapin ang URL ng iyong imahe. Maghanap ng isang imahe sa web, i-right click ito at (depende sa iyong browser) i-click ang Kopyahin ang Imahe ng URL, Kopyahin ang Imahe ng Imahe, o Kopyahin ang Lokasyon ng Larawan.
      • Gumagamit ang Firefox at Internet Explorer ng lokasyon ng kopya ng imahe. Gumagamit ang Chrome ng Copy Image URL. Gumagamit ang Safari ng Copy Image Address.
  4. Idagdag ang URL ng imahe. Sa index.html file, i-click at i-drag upang mapili ang URL ng imahe gamit ang iyong mouse, pagkatapos ay pindutin ang CTRL + V upang i-paste ang URL.
  5. Idagdag ang target na URL. Sa index.html tanggalin ang target na url at uri https://www.startpage.com.
      • Maaari mong gamitin ang anumang URL bilang target na URL.
  6. I-save ang HTML file.
  7. Buksan ang HTML file sa isang web browser. Mag-right click sa index.html at pagkatapos buksan ang file na ito sa web browser na iyong pinili.
      • Kung magbubukas ang browser ngunit hindi mo nakikita ang imahe, tiyaking nasulat mo nang tama ang pangalan ng file ng imahe sa index.html file.
      • Kapag bumukas ang browser, ngunit nakikita mo ang HTML code sa halip na ang imahe sa background, ang iyong index.html ay nai-save bilang isang .rtf file (rich text file). Subukang i-edit ang HTML file sa isa pang text editor.

Paraan 2 ng 2: Maunawaan ang HTML code

  1. Maunawaan ang tag ng anchor. Ang HTML code ay binubuo ng mga pagbubukas at pagsasara ng mga tag. Ang tag na a href = ""> ay ang start tag, at / a> ang end tag. Tinatawag itong isang anchor tag at ginagamit para sa pagdaragdag ng mga link sa isang web page.
    • Ang a Sinasabi sa isang browser na lumikha ng isang link. Ang href ay isang pagpapaikli para sa sanggunian sa HTML, ang = sinasabi sa browser na baguhin ang lahat sa pagitan ’ ’ lumikha ng isang link. Ang anumang URL ay maaaring mailagay sa pagitan ng dalawang marka ng sipi.
    • Ang / a> sinabi sa browser na ang tag ng angkla ay sarado.
    • Kapag nagdagdag ka ng teksto sa pagitan isang href = ""> at / a> ang teksto na iyon ay nagiging isang naki-click na link sa isang web page. Halimbawa: a href = "https://www.google.com"> Google / a> lumilikha ng isang link sa Google.
  2. Maunawaan ang tag ng imahe. Ang tag na img> ay isang saradong tag. Maaari mo itong isara sa img src = "" /> o img src = ""> / img>.
    • Ang img sinasabi sa tag sa isang browser na magpakita ng isang imahe. Ang src ay isang pagpapaikli para sa mapagkukunan, de = sinasabi sa browser na tanggalin ang lahat sa pagitan ng ’ ’ at kunin ang imahe mula sa lokasyon na iyon.
    • Ang /> Sinasabi sa isang browser na isara ang tag ng imahe.
    • Halimbawa: Nakukuha ng {samp [} ang imahe mula sa URL na iyon, pagkatapos ay ipinapakita ito sa isang web browser.
  3. Gamitin ang code na ito saanman. Ngayon na alam mo ang code na ito, maaari mo isang href = "target url"> img src = "image url" /> / a> para sa pagdaragdag ng mga nai-click na imahe sa anumang web page na may HTML code.