Novice mtandao wabunifu: jinsi ya kufanya mtiririko wa maandishi kuzunguka picha

Katika makala hii, sisi kukuambia kuhusu sifa za HTML na CSS, ambayo ni kuhusishwa na images. Wewe kujifunza jinsi ya kuziingiza kwenye HTML-hati. Makala pia ina taarifa kuhusu jinsi ya kubadilisha mipangilio picha, na kupanga mtiririko wa maandishi kuzunguka picha.

Kwanza - jinsi ya kuweka picha. Kwa hili kuna tag "img", ambayo ina sifa kadhaa. kuu wao - "src". Katika ni maduka anwani ambayo browser unaweza kuingiza picha. Unaweza kutaja njia ya picha tayari imehifadhiwa kwenye kompyuta, au kutoa zilizounganishwa na rasilimali ya mtandao.

Hakuna sifa si muhimu ya jozi - "upana" (upana) na "urefu" (urefu). Wao ni kutumika kwa manually kubadilisha ukubwa picha (muhimu chaguo kwa kukaza na compressing images).

Ikifuatiwa vigezo "hspace" na "vspace" (umbali kutoka picha na maandishi yanayozunguka). Ni wazi kwamba "hspace" - usawa padding na "vspace" - wima.

Sisi tag ina sifa kama vile "alt" na "title". Wao ni sawa kwa kila mmoja, kwa kuwa lengo lao ni kuelezea picha. Lakini katika "title" maagizo ya maandishi ambayo yanaonyeshwa wakati hover mouse juu ya picha, na thamani halisi ya "alt" sifa huonyeshwa katika tukio kwamba si uwezekano wa kupakia picha.

Kuna wachache sifa maalum ambayo yako katika wengi wa tags. Hii "accesskey", "darasa", "id" na "style". "Accesskey" amefafanua mchanganyiko wa funguo, kwa njia ambayo kupata kitu. "Hatari" na "kitambulisho" - vigezo kuhusishwa na CSS. Wao kueleza darasa ambayo ni mali ya picha (au utambulisho wake). "Sinema" - sifa maandishi, kuruhusu wewe kuweka kujengwa katika picha CSS cha mchezo.

Moja ya vigezo kwamba kufafanua muonekano wa picha ni "mpaka". Ni huamua unene wa mpaka karibu kitu na inaweza kuweka integer yoyote chanya (katika pikseli).

sifa ya - "align". Anafafanua mtiririko wa maandishi kuzunguka picha. Fursa hii inaweza kuweka "chini", "katikati", "kushoto", "haki" na "juu". Kila moja ya maadili huamua mahali pa picha kwenye maandishi. Kwa mfano, thamani ya "katikati" picha katikati ni iliyokaa na mipaka ya chini ya maandishi, wakati "kushoto" - kitu itakuwa upande wa kushoto wa maandishi. Lakini hii ni njia moja tu ya kuweka mtiririko wa maandishi kuzunguka picha - HTML.

Kuna zana nyingine ya nguvu - CSS (zaidi hodari). Inaweza kutumika kwa ufanisi zaidi kuweka tag sifa, ikiwa ni pamoja kati yake Nakala kuzunguka picha. CSS utapata kufafanua vigezo, si tu kitu maalum, na wale wote kama yeye. Kwa mfano, kama unataka kutaja indentation ya picha zote katika hati saizi kumi, ni wa kutosha kwa kuungana na CSS faili kwa kushona moja: "img {margin: 10px 10px 10px 10px;}" (katika mazoezi, quotes Si lazima!).

mtiririko wa maandishi kuzunguka picha, kwa mfano, kwenye kona ya kushoto hufafanuliwa kama: "img {align: kushoto;}".

Kwa njia, kuongeza CSS-code hana kuandika katika faili. Kwa lebo hii "style" ni zinazotolewa katika HTML, ambayo unaweza kuingiza CSS-code. Lakini itakuwa kazi tu kwa hati (kama unataka kuongeza nambari sawa katika faili HTML-nyingi, unapaswa kujenga tofauti style karatasi).

Sasa unaweza "kuondokana" picha ya tovuti, kwa kutumia mali ya manufaa ya tag, ambayo ni wajibu kwa hili. Jisikie huru kutumia kubadilisha ukubwa au wrap picha maandishi. Kurasa za mtandao bila graphics vipengele - kusikitisha kabisa kuona, si hivyo?