Novice web dizajnera: kako napraviti tekst strujanja oko slike

U ovom članku, mi ćemo vam reći o karakteristikama HTML i CSS, koji su povezani sa slikom. Ćete naučiti kako da ih ubacite u HTML-dokument. U članku se također sadrži informacije o tome kako promijeniti postavke slike i organizirati tekst protok oko slike.

Prvo - kako da ubacite sliku. Za to postoji oznaku "img", koji ima nekoliko atributa. Glavni od njih - "src". U njemu skladišti adresu sa koje je pretraživač može umetnuti sliku. Možete odrediti putanju do slike već pohranjene u kompjuteru, ili dati link na web resurs.

Ipak važno atribute par - "width" (širina) i "visina" (visina). Oni se koriste za ručno promijeniti veličinu slike (korisna opcija za istezanje i kompresijom slike).

Slijede parametri "hspace" i "vSpace" (udaljenost od slike na okolni tekst). Jasno, "hspace" - horizontalna postava i "vSpace" - vertikalna.

Mi tag ima atribute kao što su "alt" i "titulu". Oni su slični jedni drugima, jer njihova svrha je da opiše sliku. Ali u "title" propisana teksta koji se prikazuje kada lebdite mišem preko slike, a doslovno vrijednost "alt" atribut je prikazana u slučaju da nije bilo moguće da upload sliku.

Postoji nekoliko specifičnih atributa koji su prisutni u većini oznaka. Ovaj "accesskey", "klase", "id" i "stil". "Accesskey" definira kombinaciju tipki, kroz koji pristup objektu. "Klase" i "id" - parametri povezani s CSS. Oni opisuju klase kojoj pripada sliku (ili identifikator). "Style" - tekst atribut, što vam omogućava da postavite ugrađeni u CSS stilu slika.

Jedan od parametara koji definiraju izgled slika je "granica". To određuje debljina granice oko predmeta i može se postaviti na bilo koji pozitivan cijeli broj (u pikselima).

Narednih atribut - "poravnati". On opisuje tekst protok oko slike. Ova opcija se može podesiti na "dnu", "srednji", "lijevo", "desno" i "top". Svaki od vrijednosti određuje gdje će staviti sliku na tekst. Na primjer, vrijednost "srednji" middle sliku poravnat sa donje granice teksta, dok je "ostavio" - objekat će biti lijevo od teksta. Ali to je samo jedan od načina da postavite tekst protok oko slike - HTML-a.

Postoji još jedan moćan alat - CSS (mnogo više svestran). Može se koristiti mnogo efikasnije seta oznaku atribute, uključujući tekst protok oko slike. CSS vam omogućava da definišete parametre, a ne samo određeni objekt, a sve one poput njega. Na primjer, ako želite da odredite uvlačenje sve slike u dokumentu je deset piksela, dovoljno je da se poveže sa CSS-file to sa samo jednim bodom: "img {margin: 10px 10px 10px 10px;}" (u praksi, nisu potrebni navodnika!).

Tekst strujanja oko slike, na primjer, na lijevom rubu je definiran kao: "img {align: left;}".

Usput, dodati CSS-kod ne mora pisati u datoteku. Za ovaj tag "stil" nalazi se u HTML-u, koji možete ubaciti CSS kod. Ali to će raditi samo za taj dokument (ako želite da dodate isti kod u više HTML-datoteke, trebalo bi stvoriti poseban stil list).

Sada možete "razrijediti" slike lokacije, koristeći korisna svojstva citat, koji je odgovoran za ovo. Slobodno koristiti promjene veličine ili omotati tekst slike. Web stranice bez grafičke komponente - prilično tužan prizor, zar ne?