Grafikák és képek html «img» tag beszúrni képeket és attribútumok regisztrációjukat

Ez az ember ismert, csak,
hogy ő nem a börtönben, de miért nem ül - nem ismert.
Mark Tven.

T ő egy leckét, hogyan kell beszúrni egy képet a HTML. hogyan kell rendezni azt, hogy hogyan lehet a szöveget körüli áramlás kép, stb Köztudott, hogy a képeket, hogy a site vonzóbbá és a különböző egyéb forrásokból, így a képesség, hogy a címke és az attribútumai nagyon hasznos a mai interneten. De a lényeg itt - arányérzék!

P ereizbytok grafika hatására a súlyozás html-oldalak, és ennek megfelelően növeli a betöltési időt. Ezen felül, a jelenléte nagy számú képek is elvonja a látogató a fő tartalma a webhely (persze, ha a menetrend nem a fő tartalma a helyén). Tehát, mikor hagyja abba, és használja a képeket a HTML csak ott, ahol arra szükség van. És akkor a boldogságot!

Az előadást az attribútumok a body tag, már beszéltünk arról, hogyan lehet használni a képet, mint a háttér HTML dokumentumba. Most beszéljünk használt grafikák a „felső réteg» html-oldalak.

§ 1. Hogyan lehet behelyezni egy képet

L Kép beillesztése HTML IMG tag használják a kötelező attribútuma SRC. Ez az attribútum jelzi a böngésző elérési utat a képfájlt. Ie szúrni a képet a nevét logo.jpg egy bizonyos helyen a lap (ameddig az oldalt, és a kép található ugyanabban a mappában (könyvtár)) kell lennie ezen a helyen, helyezze be a következő html-kód:

I f kép és az oldal található különböző könyvtár (mappa), akkor meg kell adnia az elérési utat a kép képest az oldalt. Például, ha html-lap a könyvtár (mappa) hely, egy belső könyvtár (mappa) képek, és amelyben a mi kép logo.jpg, majd helyezze azt ugyanabban a könyvtár (mappa), akkor kell írni:

Az utóbbi esetben, a böngésző megjeleníti a kódot az alábbiak szerint:

P omimo kötelező SRC attribútum a IMG tag több kötelező attribútumokat. Nézzük őket részletesen.

2. § Méretek Képek

H achnom attribútumokkal, amely lehetővé teszi, hogy meghatározza a méret a kép (vagy inkább a tét ki egy helyet a méret a lap). Itt vannak:

szélesség - a szélessége pixelben a kép, vagy százalékban;

- magasság A kép pixelben vagy százalékban.

E Ha ezeket a tulajdonságokat, a böngésző első osztja helyet a menetrend, előkészíti a dokumentum elrendezése mutatják a szöveget, és csak ezután töltse be a képet. Ugyanakkor, tette a kép a kiválasztott méretű téglalap, akkor is, ha a tényleges szélessége és magassága a kép nagyobb (compress) vagy kevesebb (stretch). Abban az esetben, ha ezek a tulajdonságok nem használják, a böngésző betölti a képet, ha, és a kimeneti megy neki a szöveget, és más elemek késik.

Irene W, és a kép magasságát megadható pixel (a kép méretének állandó lesz, függetlenül attól, hogy a képernyő felbontása), és százalékban (a kép mérete attól függ, hogy a felbontás a felhasználó képernyőn). Például:

§ 3. Alternatív szöveg

Ha a felhasználó a böngésző beállításait, hogy letiltja kép, lehetséges kép helyett kijelző alternatív szöveg, ami megmagyarázza, hogy kell lennie késésben van. Ezt úgy érik el, az ALT attribútummal.

Ebben az esetben a böngésző foglalni helyet az oldalon a kép, de ahelyett, hogy a képek mutatják a szöveget, hogy írsz a ALT attribútum értéke:

P használat ismétlés, ez meg fog történni, ha a felhasználó úgy döntött, grafika. Ha nem, akkor a kép will hide egy alternatív szöveget.

4. § igazítása képek

Az ismerős align attribútum akkor az ellenőrzés az összehangolás képek kapcsolatban egyéb elemeinek html-oldalak. Az align tulajdonság több értéket, de mi leginkább érdekli a pillanatban két:

A balra - a kép bal oldalán található a lap szélére, és a szöveg körbe a kép jobb oldalán;

jobbra - a kép található a jobb szélén az oldal, és a szöveg és más elemek körül az áramlás a képre, a bal oldalon.

N Például a HTML-kódot

a böngésző fogja mutatni az utat

Úgy fog kinézni:

D leállításához csomagolópapír szöveget képeket is használható BR tag (ismerős az előző részben a szövegformázását HTML). Van egy világos BR-attribútum. amely akár három értéket:

bal - megszűnése szövegtöréshez képek igazodnak a bal szélén;

jobbra - a megszűnését szövegtöréshez képek rendezi a jobb szélén;

összes - megszűnése pakolás szövegeket, képeket, és igazodik a balra és jobbra.

§ 5. Készítsen padding körül képek

P újra az alapértelmezett, képek vannak beágyazva az oldalon nagyon közel van a szöveg és más elemek. Ha ez a kijelző nem elégedett, akkor lehet beállítani a margókat a kép körül. Ez úgy történik, hogy a következő tag attribútumok IMG:

vSpace - létrehozza a felső és alsó margó;

hspace - létrehozza az oldalsó margók (balra és jobbra).

H Az értékek Ezen attribútumok meghatározott pixel. Például, ha van egy kis kiegészítés az előző példában:

megkapjuk a következő:

Ugyanazzal ez a módja az egész „készítmény” nézd előtt (fent).

6. § A keret a kép körül

A kerületi képek létrehozhat egy fekete keret segítségével a határ attribútumot. Ennek értéke attribútum meghatározott pixel és meghatározza a keret vastagsága. Például a HTML-kód:

A böngésző így néz ki:

§ 7. Következtetés

H és ebben a szakaszban a címkéket HTML. amelyek ahhoz szükségesek, hogy helyezze be a képeket az oldalakon a helyszínen befejeződött. A következő részben lesz szó, hogyan lehet létrehozni linkeket és hogyan lehet összekapcsolni a kép-a HTML.

Ossza meg ezt az oldalt:

előző ◈ a következő