Această postare va explica pe scurt metoda de adăugare a imaginii dintr-o adresă URL.
Cum să adăugați o imagine dintr-o adresă URL în HTML/CSS?
În HTML/CSS, sunt disponibile două metode pentru a adăuga o imagine folosind adresa URL, care este listată mai jos:
- Metoda 1: Adăugați o imagine folosind un element în HTML
- Metoda 2: Adăugați o imagine folosind proprietățile CSS în HTML
Metoda 1: Adăugați o imagine utilizând elementul
„ ” elementul este un singur element void care nu are conținut secundar și etichetă de sfârșit. „ src ' și ' Tot ” sunt două atribute cheie care sunt utilizate în interiorul etichetei „ ”.
Să ne uităm la instrucțiunile de mai jos pentru a adăuga o imagine folosind elementul !
Pasul 1: Faceți un container div
Mai întâi, creați un container div utilizând „ Apoi, utilizați eticheta de antet necesară din „ ' la ' ' etichetă. De exemplu, vom folosi eticheta După aceea, adăugați un „ ” etichetați și introduceți atributele enumerate mai jos în interiorul etichetei imaginii: Conform rezultatului de mai jos, imaginea specificată a fost adăugată cu succes: Dezvoltatorii pot adăuga, de asemenea, imaginea dintr-o adresă URL folosind CSS „ imagine de fundal ” CSS. în acest scop, urmați pașii de mai jos. Mai întâi, inserați un text de titlu cu ajutorul etichetei de deschidere și închidere Apoi, creați un container div utilizând eticheta Acum, accesați clasa prin selectorul de puncte „ . ” și numele clasei care a fost creat anterior. După aceea, aplicați proprietățile CSS enumerate mai jos pentru a adăuga imaginea dintr-o adresă URL în interiorul clasei: În codul furnizat mai sus: Ieșire Ați învățat despre diferitele metode de adăugare a imaginilor dintr-o adresă URL. Pentru a adăuga o imagine dintr-o adresă URL, dezvoltatorii pot utiliza „ ' etichetă. Apoi, introduceți „ src ” și atribuiți adresa URL ca valoare „src”. În plus, utilizatorul poate adăuga o imagine de la adresa URL utilizând CSS „ imagine de fundal ” proprietate. Acest articol a precizat metodele de adăugare a imaginii de la adresa URL în HTML/CSS.
Pasul 2: Inserați titlul
și vom adăuga textul special ca titlu în interiorul etichetelor de deschidere și de închidere.
Pasul 3: Adăugați o imagine folosind adresa URL
< div clasă = 'img-conatiner' >
< h2 > Adăugați o imagine cu URL < / h2 >
< img src = „https://images.pexels.com/photos/2260800/pexels-photo-2260800.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1” Tot = 'Imagine!' înălţime = '400px' lăţime = '300px' / >
< / div >
Metoda 2: Adăugați o imagine folosind proprietățile CSS în HTML
Pasul 1: Inserați titlul
.
Pasul 2: Creați un container div
> Adăugați o imagine cu URL
>
Pasul 3: Accesați containerul
Pasul 4: Adăugați o imagine folosind proprietatea CSS „imagine de fundal”.
înălţime : 400px ;
lăţime : 250px ;
dimensiunea fundalului : conține ;
Imagine de fundal : url ( https : //imagini .pexeli .com/photos/ 2260800 /pexels-photo- 2260800 .jpeg? auto = comprima&cs = tinysrgb&w = 1260 &h = 750 &dpr = unu )
}
Concluzie