Додајте везу на слику у ХТМЛ-у

Аутор: Christy White
Датум Стварања: 12 Може 2021
Ажурирати Датум: 1 Јули 2024
Anonim
#8 ActiveBox - Верстка сайта с нуля для начинающих | jQuery
Видео: #8 ActiveBox - Верстка сайта с нуля для начинающих | jQuery

Садржај

Помоћу једног реда ХТМЛ кода можете додати слику на коју можете кликнути на скоро било коју веб локацију. Две ствари су вам потребне да би ово успело. Потребан вам је УРЛ слике, а такође и УРЛ веб странице.

На корак

Метод 1 од 2: Напишите ХТМЛ код

  1. Направите ХТМЛ датотеку. Отворите уређивач текста, а затим креирајте нову датотеку. Сачувајте датотеку као индек.хтмл.
      • Можете да користите било који уређивач текста који желите, чак и једноставне уређиваче текста у оперативном систему Виндовс (Нотепад) и Мац ОС Кс (ТектЕдит).
      • Ако желите да користите уређивач текста намењен за рад са ХТМЛ-ом, кликните овде да бисте преузели Атом, уређивач текста за Виндовс, Мац ОС Кс и Линук.
      • Ако користите ТектЕдит, кликните мени Формат пре креирања ХТМЛ датотеке, а затим кликните Маке Плаин Тект. Ова поставка осигурава да се ХТМЛ датотека правилно учитава у веб прегледачу.
      • Процесори речи као што је Мицрософт Ворд заправо нису добри за писање ХТМЛ-а, јер додају невидљиве знакове и форматирање који могу оштетити ХТМЛ датотеку и приказати је погрешно приказану у веб прегледачу.
  2. Копирајте и налепите стандардни ХТМЛ код. Изаберите и копирајте ХТМЛ код у наставку и налепите га у свој отворени индек.хтмл.

    а хреф = "таргет урл"> имг срц = "урл слике" /> / а>

  3. Пронађите УРЛ слике. Пронађите слику на вебу, кликните десним тастером миша и (у зависности од прегледача) кликните Копирај УРЛ слике, Копирај адресу слике или Копирај локацију слике.
      • Фирефок и Интернет Екплорер користе локацију копирања слике. Цхроме користи УРЛ за копирање слике. Сафари користи Цопи Имаге Аддресс.
  4. Додајте УРЛ слике. У датотеци индек.хтмл кликните и превуците да бисте мишем изабрали УРЛ слике, а затим притисните ЦТРЛ + В да бисте налепили УРЛ.
  5. Додајте циљну УРЛ адресу. У индек.хтмл избришите циљни УРЛ и тип хттпс://ввв.стартпаге.цом.
      • Можете користити било коју УРЛ адресу као циљну УРЛ адресу.
  6. Сачувајте ХТМЛ датотеку.
  7. Отворите ХТМЛ датотеку у веб прегледачу. Кликните десним тастером миша на индек.хтмл, а затим отворите ову датотеку у веб прегледачу по вашем избору.
      • Ако се прегледач отвори, али слике не видите, у датотеци индек.хтмл проверите да ли сте правилно написали име датотеке са сликом.
      • Када се прегледач отвори, али уместо слике у позадини видите ХТМЛ код, индек.хтмл се чува као .ртф датотека (датотека обогаћеног текста). Покушајте да уредите ХТМЛ датотеку у другом уређивачу текста.

2. метод од 2: Разумевање ХТМЛ кода

  1. Разумевање сидрене ознаке. ХТМЛ код се састоји од отварања и затварања ознака. Ознака а хреф = ""> је почетна, а / а> крајња ознака. То се назива сидрена ознака и користи се за додавање веза на веб страницу.
    • Тхе а говори прегледачу да креира везу. Тхе хреф је скраћеница за ХТМЛ референцу, = каже прегледачу да промени све између ’ ’ створити везу. Било која УРЛ адреса може се ставити између два наводника.
    • Тхе / а> говори прегледачу да је ознака сидра затворена.
    • Када додате текст између а хреф = ""> и / а> тај текст постаје веза на коју се може кликнути на веб страници. На пример: а хреф = "хттпс://ввв.гоогле.цом"> Гоогле / а> креира везу до Гоогле-а.
  2. Разумевање ознаке слике. Ознака имг> је затворена ознака. Можете га затворити помоћу имг срц = "" /> или имг срц = ""> / имг>.
    • Тхе имг таг говори прегледачу да прикаже слику. Тхе срц је скраћеница за извор, де = каже прегледачу да избрише све између ’ ’ и преузмите слику са те локације.
    • Тхе /> говори прегледачу да затвори ознаку слике.
    • На пример: {самп [} добија слику са те УРЛ адресе, а затим је приказује у веб прегледачу.
  3. Користите овај код свуда. Сад кад знате овај код, можете а хреф = "таргет урл"> имг срц = "урл слике" /> / а> за додавање слика на које је могуће кликнути на било коју веб страницу са ХТМЛ кодом.