Attēli ir ļoti svarīga tīmekļa lapas sastāvdaļa, jo tie uzlabo tīmekļa lapas izskatu un palielina klientu mijiedarbību. Vairāku vietņu USP ir veids, kā viņi savās tīmekļa lapās organizē dažādus attēlus un pievieno tam garšas. Šajā Rakstā Attēli mēs sapratīsim, kā iegult attēlus tīmekļa lapā, izmantojot HTML, šādā secībā:
Kā pievienot attēlu HTML
Iegult attēlu tīmekļa lapā HTML dod jums tagu. Vēl viens svarīgs jautājums, kas jāatceras, ir nav beigu taga. skr atribūtu izmanto, lai norādītu attēla ceļu, kas var būt URL vai attēla ceļš no sistēmas / servera. Vispirms sāksim ar attēla iegulšanas pamata sintaksi tīmekļa lapā, izmantojot HTML.
Sintakse
img src = 'img / front-end-web-development / 50 / what-are-html-images.png'>
Parauga kods
HTML attēlu ievietošana attēlos tīmekļa vietnē
Līdzīgi kā citiem tagiem, ar to ir saistīti dažādi atribūti tagu. Apskatīsim katru no viņiem pa vienam, sapratīsim viņu vajadzības un kā tos izmantot.
HTML attēlu tagi
- alt Atribūts
Atribūts alternatīvs ir attēla teksts. Iemesls, kāpēc tika ieviests alt atribūts, ir tāds, ka attēlu kāda iemesla dēļ nevarēja ielādēt, tāpēc vajadzētu parādīties alternatīvs teksts, kas sniedz priekšstatu par attēlu. Attēla ielādes iemesli var būt lēns interneta savienojums vai attēls neatrodas norādītajā avotā utt.
Ja attēls atrodas tajā pašā mapē, kur atrodas HTML fails, varat tieši norādīt faila nosaukumu. Pretējā gadījumā jums ir jānorāda attēla faila absolūtais ceļš.
Atribūta Alt vērtībai vajadzētu aprakstīt attēlu.
Piemērs
HTML attēlu ievietošana attēlos tīmekļa vietnē
iestatīt java klases ceļa logus 7
- Attēla platums un augstums
Stila atribūtu izmanto, lai iestatītu attēla augstumu un platumu. Stila atribūtā jūs norādāt CSS stilu.
HTML attēlu ievietošana attēlos tīmekļa vietnē
Daži no svarīgiem jautājumiem, iegult attēlu tīmekļa vietnē, izmantojot HTML, ir:
kā dinamiski piešķirt masīvu Java
- Platuma un augstuma atribūti ir noteikti pikseļos.
- Jūs varat arī definēt attēla platumu un augstumu procentos. Tā ņems vērā procentuālo daļu atbilstoši visai tīmekļa vietnei.
- Ja jūs norādāt tikai vienu no tiem, tas attiecīgi pielāgo otru.
- Attēlu iegulšana, izmantojot URL
HTML nodrošina arī elastību, kur jūs varat izvēlēties attēlu no cita servera, vienkārši norādot URL. Attēlu mitināšanai un pēc tam šo attēlu iegulšanai, izmantojot URL, varat izmantot atsevišķu serveri.
HTML attēlu ievietošana attēlos tīmekļa vietnē
- Attēls kā saite
Attēlu var izmantot arī kā saiti, kurā lietotājs var noklikšķināt uz attēla un nokļūt jaunā tīmekļa lapā. Lai to izdarītu, jums vienkārši jāievieto diena tagu.
HTML attēlu ievietošana attēlos tīmekļa vietnē
- Attēls peldošs
Jūs varat arī pielāgot attēla izlīdzināšanu, izmantojot CSS pludiņa rekvizītu. Stila atribūtā ir jānorāda viss CSS rekvizīts.
HTML attēls Attēls peldēs pa labi no teksta. Attēls peldēs pa kreisi no teksta.
- Attēlu kartes
Šī ir viena no svarīgākajām HTML piedāvātajām funkcijām. tags palīdz noteikt attēla karti. Jums noteikti jābrīnās, kas ir attēlu karte. Attēlu karte ir attēls ar apgabaliem, uz kuriem var noklikšķināt
HTML attēls
- Fona attēls
Tīmekļa lapā varat pievienot arī fona attēlu. Jums vienkārši jāizmanto CSS rekvizīts, ti, fona attēls stila tagā un jāpievieno HTML elementam.
HTML attēlsFona attēls
BODY elements
Ar to mēs esam nonākuši pie šī HTML attēlu emuāra beigām.Tagad, izpildot iepriekš minētos fragmentus, jūs būtu sapratis, kā HTML ievietot attēlu. Es ceru, ka šis emuārs ir informatīvs un sniedz jums pievienoto vērtību.
Pārbaudiet mūsu kas nāk ar instruktoru vadītu tiešraides apmācību un reālās dzīves projektu pieredzi. Šīs apmācības ļauj jums prasmīgi strādāt ar back-end un front-end tīmekļa tehnoloģijām. Tas ietver apmācību par Web izstrādi, jQuery, Angular, NodeJS, ExpressJS un MongoDB.
Vai mums ir jautājums? Lūdzu, pieminējiet to emuāra “HTML attēli” komentāru sadaļā, un mēs ar jums sazināsimies.