Za začetnike: kako pripraviti besedilo okoli slike

V tem članku vam bomo povedali o značilnostih HTML in CSS, ki so povezane s slikami. Naučili se boste, kako jih vstaviti v dokument HTML. Tudi v članku boste našli informacije o tem, kako spremeniti parametre slike in organizirati pretok okoli slike z besedilom.

Najprej - o vstavljanju slike. Če želite to narediti, obstaja Oznaka »img« ki ima več atributov. Glavna je "src". Shrani naslov, iz katerega lahko brskalnik vstavi sliko. Določite lahko pot do slike, ki je že shranjena v računalniku, ali pa povezavo s spletnim virom.

Naslednji pomemben par atributov je "širina" in "višina". Uporabljajo se za ročno spreminjanje velikosti slike (uporabna možnost za raztezanje in stiskanje slike).

Nato parametri "hspace" in "vspace" (oddaljenost od slike do okoliškega besedila). Jasno je, da je "hspace" vodoravna alinea in "vspace" je navpična.

Oznaka ima atribute, kot sta "alt" in "title". So podobni drug drugemu, kajti njihov namen je opisati sliko. Toda v "naziv" predpisano besedilo, ki se prikaže, ko se z miško nad sliko in dobesedno vrednost atributa »alt« se prikaže v primeru, da ni bilo mogoče naložiti sliko.

V večini oznak je na voljo nekaj več specifičnih atributov. So "accesskey", "class", "id" in "style". Nastavitve »Accesskey« kombinacija tipk, s katerim je predmet dostopen. "Razred" in "id" sta parametri, povezani s CSS. Opisujejo, kateri razred pripada sliki (ali njenim identifikatorjem). »Slog« je besedilni atribut, ki vam omogoča, da podate vgrajeno sliko CSS sloga.

Eden od parametrov, ki določajo videz slike, je "meja". Določa debelino okvira okoli predmeta in jo lahko določi katero koli pozitivno celo število (v pikslih).

Naslednji atribut je "poravnaj". Opisuje tok okoli slike z besedilom. Ta parameter lahko sprejme vrednosti "spodaj", "srednji", "levi", "desni" in "top". Vsaka od vrednosti določa, kje bo slika v primerjavi z besedilom. Na primer, če je vrednost "sredina", bo sredina slike poravnana na dnu besedila in ko bo "levo" - predmet bo na levi strani besedila. Ampak to je le en način za nastavitev pretoka besedila okoli besedila - HTML.

Obstaja še eno močno orodje - CSS (veliko bolj vsestransko). Uporablja se lahko veliko bolj učinkovito določiti atribute oznak, vključno potek besedila okrog slike. CSS vam omogoča, da določite parametre ne samo določenega predmeta, temveč vse podobne. Na primer, če želite, da določite zamik vseh slik v dokumentu je deset točk, je dovolj, da se povežete z CSS-datoteka, z enim šivom: "img {marža: 10px 10px 10px 10px;}" (v praksi, niso potrebni narekovajev!).

In tok okoli slike z besedilom, na primer na levi strani je nastavljen takole: "img {align: left;}".

Mimogrede, za dodajanje CSS-kode ga ni treba zapisati v datoteko. Če želite to narediti, HTML ponuja oznako »slog«, v katero lahko vstavite CSS-kodo. Vendar bo delovala samo za ta dokument (če želite dodati isto kodo več datotekam HTML, potem morate ustvariti ločen slogovni list).

Zdaj lahko spletno mesto "razrežite" s slikami, ki uporablja za to uporabne uporabne lastnosti oznake. Poskrbite za velikost ali spreminjanje besedila okoli slike. Spletne strani brez grafičnih komponent so precej dolgočasen, kajne?