Naujokas web dizaineriai: kaip padaryti teksto srautą aplink vaizdus

Šiame straipsnyje mes jums pasakys apie HTML ir CSS savybių, kurios yra susijusios su vaizdų. Jūs išmoksite, kaip įterpti juos į HTML dokumentą. Straipsnyje taip pat pateikiama informacija apie tai, kaip pakeisti vaizdo nustatymus ir tvarkyti tekstinius srautus aplink vaizdą.

Pirma - kaip įterpti paveikslėlį. Už tai yra žymė "IMG", kuri turi keletą atributų. Jų pagrindinis - "src". Jame saugo adresą, iš kurio naršyklė gali įterpti paveikslėlį. Galite nurodyti kelią iki paveikslėlio jau saugomi kompiuteryje, arba duoti nuorodą į interneto išteklių.

Ne mažiau svarbi požymiai poros - "plotis" (plotis) ir "aukštis" (aukštis). Jie naudojami rankiniu būdu keisti vaizdus (naudinga galimybė tempimo ir glaudinti vaizdus).

Pridedant parametrai "hspace" ir "Vspace" (atstumas iš paveikslėlio į aplinkinio teksto). Akivaizdu, "Hspace" - horizontali apdaila ir "Vspace" - vertikali.

Mes tag atributus, pavyzdžiui, "alt" ir "antraštė". Jie yra panašūs vienas į kitą, nes jų tikslas yra apibūdinti vaizdą. Tačiau "antraštė" nustatyta tekstą, kuris bus rodomas, kai jūs užveskite pelę virš atvaizdo, o pažodinis vertė "alt" atributu rodoma tuo atveju, jei tai buvo neįmanoma įkelti vaizdą.

Yra keletas specifinių atributų, kurie yra pateikti į žymių balsų dauguma. Šis "accesskey", "klasė", "id" ir "stilius". "Accesskey" apibrėžia klavišų kombinaciją, per kurią prieigą prie objekto. "Klasė" ir "ID", - parametrai, susijusios su CSS. Jie aprašyti klasę, kuriai priklauso paveikslėlyje (arba jo identifikavimo numerį). "Stilius" - atributas tekstas, kad būtų galima nustatyti built-in vaizdo CSS stiliaus.

Vienas iš parametrų, apibrėžiančių paveikslėlio išvaizdą yra "sienos". Tai lemia sienos aplink objekto storį ir gali būti nustatytas bet koks teigiamas sveikasis skaičius (pikseliais).

Kitas požymis - "align". Jis aprašo teksto srautą aplink vaizdą. Ši parinktis gali būti nustatytas "iš apačios", "vidutinio", "kairė", "teisė" ir "iš viršaus". Kiekvienas vertybes nustato, kur įdėti paveikslėlio tekstą. Pavyzdžiui, vertė "vidurinės" vidurinės atvaizdo yra suderinta su apatinės ribos teksto, o "kairė" - objektas bus teksto kairėje. Bet tai tik vienas iš būdų nustatyti teksto srautą aplink vaizdą - HTML.

Yra dar vienas galingas įrankis - CSS (daug universalesnis). Jis gali būti naudojamas daug efektyviau nustatyti tag atributus, įskaitant teksto srautas aplink vaizdą. CSS leidžia jums apibrėžti parametrus, ne tik konkretų objektą, ir visi tie, kaip jis. Pavyzdžiui, jei norite nurodyti visų paveikslėlių dokumento įdubimas yra dešimt taškų, pakanka prisijungti prie CSS failą su vienu dygsnio: "img {margin: 10px 10px 10px 10px;}" (praktiškai kabučių nereikia!).

Teksto srautas aplink vaizdų, pavyzdžiui, dėl kairiojo krašto yra apibrėžiama taip: "img {suderinti: kairėje;}".

Beje, pridėti CSS kodo neturi rašyti į failą. Dėl šios žyma "stilius" yra numatyta HTML, kurią galite įterpti CSS kodą. Bet tai veiks tik dokumento (jei norite pridėti tą patį kodą keliomis HTML failus, jums reikia sukurti atskirą stilių).

Dabar galite "praskiesti" vaizdus svetainėje, naudojant naudingų savybių žyma, kuri yra atsakinga už tai. Jauskitės laisvai naudoti Resize arba įvyniokite teksto nuotraukas. Tinklalapius be grafikos komponentai - gana liūdnas reginys, ar ne?