Како да убаците слику у ХТМЛ на вашем веб сајту

10. 3. 2020.

Додавање слика на вашу веб локацију или профил друштвене мреже је одличан начин да украсите своју страницу. ХТМЛ (Хипертект Маркуп Лангуаге) се разликује по великом броју веб развојних функција, а код који је потребан за додавање слика је прилично једноставан.

како убацити слику у хтмл

Дакле, како уметнути слику у ХТМЛ?

Пренесите слику на бесплатну страницу за хостинг слика, као што је Пхотобуцкет или ТиниПиц, која обезбеђује сталан приступ преузетој датотеци. Након копирања линк на слику ће се појавити директно на сајту хостинга. Међутим, ако плаћате врхунске услуге такве услуге, боље је користити додатне функције. Ово је поузданије, јер у бесплатном хостингу слика, слике се понекад не отварају због преоптерећења. Након што сте учитали слику у неку од мрежних услуга, отворите нови документ на рачунару у уређивачу текста (на пример, у Нотепаду) или идите на плочу за уређивање жељене странице вашег сајта (где можете да промените ХТМЛ код).

хтмл како да убаците слику

Писање ознака

Настављајући да говорите о томе како да убаците слику у ХТМЛ, започните са ИМГ тагом. Након тога, морате додати размак и сласх знак испред знака за затварање. Дакле, морате бирати следећу комбинацију - <имг />. Поред тога, постоји много атрибута који су доступни, али само један од њих је апсолутно неопходан. Ово је адреса или УРЛ ваше слике. Наведено је на следећи начин - <имг срц = "УРЛ_ ваше слике" />.

Алтернативни текст

Затим, покушавајући да убаците слику у ХТМЛ, морате додати Алт атрибут. Ово дефинише алтернативни текст у случају да се слика не учита. Такав текст је намењен и корисницима са оштећеним видом који користе читаче екрана. Ако лебдите курсор миша на слици, алтернативни текст ће се појавити у опису алата, али ова функција је присутна само у програму Интернет Екплорер. Да бисте га видели у другим апликацијама, биће вам потребни посебни додаци. Да бисте унели такав опис, унесите га као додатак Алт. (Можете прескочити овај корак). Ако користите ову функцију, веза ће изгледати овако:

<имг срц = "УРЛ_иоур_оф_артицле" алт = "поп-уп_тект" "титле =" Тоолтип "/>

уметните слику у хтмл

Величине и параметри слике

Настављајући да пратите упутства о томе како да убаците слику у ХТМЛ, можете додатно одредити величину слике користећи атрибуте висине и ширине који означавају у пикселима или у процентима. Имајте на уму да ће слика бити приказана због промене величине при подизању система. Претраживач ће и даље користити стварну величину слике. Из тог разлога, ако је ваша слика превелика, боље је да је промените. сизе витх усинг програми за уређивање фотографија а не само адресу везе. Сада ваш код може изгледати овако:

<имг срц = "УРЛ ваше слике" алт = "текттип текст" титле = "Тоолтип" хеигхт = "50%" видтх = "50%" />

<имг срц = "УРЛ ваше слике" алт = "тоолтип тект" титле = "Тоолтип" хеигхт = "25пк" видтх = "50пк" />

Други атрибути

Вредност ових атрибута је или позитивна вредност пиксела или проценат са оригиналом (1-100%). Говорећи о томе како да убаците слику у ХТМЛ, такође можете да приметите да се она може поставити било где на веб страници са атрибутом поравнања - горњи, доњи, средњи, десни, леви итд. Атрибут ХСПАЦЕ се користи за уметање слика хоризонтално на леву и десну страну, ВСПАЦЕ - за учитавање вертикално између врха и дна странице и релативно према другом садржају. Ако говоримо уопштено о ХТМЛ-у - како да убацимо слику, и како да додамо садржај на страницу, главна ствар је да се не претјерате. Иначе, ваш ресурс ће изгледати неуредно и превише "шарено". ГИФ ће бити најбоље решење за приказивање логотипа или анимација, а ЈПЕГ је погоднији за квалитетне слике и фотографије.