gtemata.com

Cum se introduc imagini în HTML

Adăugarea de imagini pe site-ul sau în profilul dvs. într-o rețea socială este o modalitate excelentă de ao înfrumuseța. HTML (HyperText Markup Language) are multe capabilități de dezvoltare web, dar codul necesar pentru a adăuga imagini este relativ simplu.

paşi

Inserați imagini în HTML

Imaginea intitulată Inserați imagini cu HTML Pasul 1
1
Încărcați imaginea pe un site care oferă un serviciu de găzduire a imaginilor, cum ar fi Photobucket sau TinyPic, și care vă permite să utilizați conexiunea la cald. Cu hot-linking ne referim la o legătură directă a imaginii de pe serverul site-ului - unele site-uri nu o permit, deoarece exploatează lățimea de bandă și ocupă spațiu pe serverele lor.
  • Dacă aveți un serviciu de gazduire plătit, este mai bine să îl utilizați pentru încărcarea imaginii. Este mult mai sigur decât site-urile gratuite.
  • Imaginea intitulată Inserați imagini cu HTML Pasul 2
    2
    Deschideți un document nou într-un editor de text (ex. Notepad) sau direct pe site / profil unde puteți edita codul HTML.
  • Imaginea intitulată Inserați imagini cu HTML Pasul 3
    3
    Începeți cu eticheta img. Eticheta img este gol, ceea ce înseamnă că nu este nevoie să îl închideți. Cu toate acestea, pentru ca acesta să fie valabil și în XHTML, puteți adăuga un spațiu și un slash înainte de semnul major.
  • Imagine intitulată Inserați imagini cu HTML Pasul 4
    4


    Există multe atribute care pot fi adăugate, dar numai una este absolut necesară: src. Aceasta indică adresa sau adresa URL a imaginii dvs.
  • Imaginea intitulată Inserați imagini cu HTML Pasul 5
    5
    Acum ar trebui să adăugați atributul oprire. Aceasta specifică textul alternativ în cazul în care imaginea nu se încarcă. Mai mult, acest lucru este citit de cititorii automați pe computere pentru orbi.
  • Arătând cursorul pe imagine, textul alternativ va apărea, dar numai în Internet Explorer. O soluție care funcționează pe toate browserele (Firefox este bine et al.) este de a folosi atributul titlu precum și oprire. (Dacă nu vă pasă că mesajul apare pe imagine, uitați acest pas.)
  • exemplu:

    1. 1
      În plus, există și posibilitatea de a specifica dimensiunea imaginii, utilizând atributele înălțime și lățime (înălțime și lățime) și specificând numărul de pixeli sau procentul. Rețineți că modificarea acestei valori va modifica numai modul în care este afișată imaginea. Browserul va încărca în continuare dimensiunea reală a imaginii, deci dacă aveți una prea mare, ar trebui mai degrabă să o redimensionați utilizând un program de editare foto sau PicResize.com.
    2. Imagine intitulată Inserați imagini cu HTML Pasul 6Bullet1
    3. Imagine intitulată Inserați imagini cu HTML Step 6Bullet2

    Sfaturi

    • Valoarea acestor atribute este un număr pozitiv care indică pixeli sau o valoare procentuală de la 1 la 100.
    • Fotografia sau imaginea pot fi plasate în orice parte a paginii web cu atributul "alinia", plasându-l pe partea de sus (partea de sus), partea de jos (partea de jos), centrul (mijlocul), dreapta (dreapta), stânga (stânga) etc.
    • Valoarea "hspace" se utilizează pentru a insera spațiu la dreapta și la stânga imaginii, în timp ce atributul "vspace" introduce spațiu deasupra și dedesubtul imaginii pentru al separa de celelalte elemente de pe pagină.
    • Nu exagerați imaginile. Va arata doar ca o pagina dezorganizata si amator.
    • Pentru logouri sau animații, imaginile GIF sunt bune, în timp ce imaginile JPEG sunt mai bune pentru imagini mai complexe, cum ar fi fotografiile.
    • Imaginile GIF acceptă numai culori pe 8 biți pentru până la 256 de culori. De aceea, pierderea detaliilor este inevitabilă dacă utilizați acest format pentru imagini bogate în culori cum ar fi fotografii.
    • Imaginile GIF suportă transparența. O singură culoare poate fi setată ca transparentă.
    • Intercalarea este de asemenea susținută de imagini GIF și aceasta permite o previzualizare a imaginii înainte de a fi complet încărcată.
    • Formatul GIF acceptă, de asemenea, animație.

    Avertismente

    • Nu faceți legătura la cald dacă nu este permisă!
    Distribuiți pe rețelele sociale:

    înrudit