Tento príspevok stručne vysvetlí spôsob pridávania obrázka z adresy URL.
Ako pridať obrázok z adresy URL v HTML / CSS?
V HTML/CSS sú k dispozícii dva spôsoby pridania obrázka pomocou adresy URL, ktorá je uvedená nižšie:
- Metóda 1: Pridajte obrázok pomocou prvku v HTML
- Metóda 2: Pridajte obrázok pomocou vlastností CSS v HTML
Metóda 1: Pridajte obrázok pomocou prvku
' ” element je jeden neplatný element, ktorý nemá žiadny podradený obsah a koncovú značku. ' src “ a „ všetko ” sú dva kľúčové atribúty, ktoré sa používajú vo vnútri značky „ “.
Pozrime sa na nižšie uvedené pokyny na pridanie obrázka pomocou prvku !
Krok 1: Vytvorte kontajner div
Najprv vytvorte kontajner div pomocou „ Ďalej použite požadovanú značku nadpisu z „ “ až “ ” tag. Napríklad použijeme značku Potom pridajte „ ” a do značky obrázka vložte atribúty uvedené nižšie: Podľa nižšie uvedeného výstupu bol zadaný obrázok úspešne pridaný: Vývojári môžu tiež pridať obrázok z adresy URL pomocou CSS “ obrázok na pozadí “CSS. na tento účel postupujte podľa krokov uvedených nižšie. Najprv vložte text nadpisu pomocou otváracej a zatváracej značky Potom vytvorte kontajner div pomocou značky Teraz prejdite do triedy pomocou selektora bodiek “ . “ a názov triedy, ktorý bol vytvorený predtým. Potom použite vlastnosti CSS uvedené nižšie na pridanie obrázka z adresy URL do triedy: Vo vyššie uvedenom kóde: Výkon Dozvedeli ste sa o rôznych metódach pridávania obrázkov z adresy URL. Na pridanie obrázka z adresy URL môžu vývojári použiť „ ” tag. Potom vložte „ src ” a priraďte URL ako hodnotu “src”. Okrem toho môže používateľ pridať obrázok z adresy URL pomocou CSS „ obrázok na pozadí ' nehnuteľnosť. Tento zápis uvádza metódy na pridanie obrázka z adresy URL do HTML/CSS.
Krok 2: Vložte nadpis
a do úvodnej a záverečnej značky pridáme konkrétny text ako nadpis.
Krok 3: Pridajte obrázok pomocou adresy URL
< div trieda = 'img-conatiner' >
< h2 > Pridať obrázok s URL < / h2 >
< img src = 'https://images.pexels.com/photos/2260800/pexels-photo-2260800.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=1' všetko = 'Obrázok!' výška = '400 pixelov' šírka = '300 pixelov' / >
< / div >
Metóda 2: Pridajte obrázok pomocou vlastností CSS v HTML
Krok 1: Vložte nadpis
.
Krok 2: Vytvorte kontajner div
> Pridať obrázok s adresou URL
>
Krok 3: Prístup ku kontajneru
Krok 4: Pridajte obrázok pomocou vlastnosti CSS „obrázok na pozadí“.
výška : 400 pixelov ;
šírka : 250 pixelov ;
veľkosť pozadia : obsahujú ;
Obrázok na pozadí : url ( https : //snímky .pexels .com/photos/ 2260800 /pexels-photo- 2260800 .jpeg? auto = komprimovať&cs = tinysrgb&w = 1260 &h = 750 &dpr = jeden )
}
Záver