QL.túra miazmás

Arra kerestem megoldás, hogy hogyan tudok HTML-ben egy neten fellelhető képből kivágni egy kis részt, hogy utána a blog-ban csak ez a kis rész látszódjon.

Megpróbálom az itt bemutatott kép felét lerágni. Némi CSS böngészés után az alábbi megoldásra jutottam.

A képet (<img ...> tag) egy külön egységbe (<div ...> tag) kell betenni. A div szélessége, a befoglalótól relatív legyen; valós mérete, vágja le a kilógó részeket és a szöveg folyja körbe balról. Utána jön a kép pozícionálása. Kicsit játszani kell az értékekkel, hogy jól eltaláljuk a levágandó részt. A Windows mspaint-je segíthet ebben. Ha az image-ben állítjuk a width és height-t, akkor torzítani is lehet a képet.

Ezek után vágjuk ki a címkét.

<div style="width: 180px; height: 90px; position: relative; border: 1; overflow: hidden; float: right;"><img src="http://firedream.com/wp-content/uploads/2012/07/price-cut.jpg" alt="" class="imgleft" style="position: absolute; top: -10px; left: -70px;" /></div>

Vagdaljunk minden nap!