Nem tudom, ha jól értelek. Azt akarod kérdezni, hogy mi formázza a forráskódokat? A színezés? 🙂 Ha igen, akkor a válaszom: WP-Syntax.
Darabolás mentes hivatkozás képeken
Írta: Tupacko | 2008. május 03. | kategóriák: (X)HTML, Alapok, CSS, DesignEz egy rövid példa arra, hogy miként lehet egy háttérképre, például a fejléc hátterére, linket tenni, pl. a logóra. Természetesen ebből az következik, hogy nem szükséges a kép felvágása, csupán XHTML és CSS segítségével kivitelezhető. A megoldás egyaránt valid és cross-browser.
1. lépés
Helyezzünk egy linket a kérdéses helyre. Én a fejlécben szeretnék egy kattintható felületet a logónak, ami visszamutat a főoldalra.
1 2 3 | <div id="header"> <a href="index.html" title="" id="logoLink"> </a> </div> |
2. lépés
Helyezzük és méretezzük a kattintható felületet az igényünk szerint. (A beállítások ideje alatt érdemes egy jól látható keretet is meghatározni a linknek, hogy pontosan lássuk a kattintható felületet).
1 2 3 4 5 6 7 8 9 10 11 | #logoLink{ position: relative; /* a pozicionális típusa. Egy link esetében megfelel a relatív elhelyezés is, viszont nagyszámú link esetében érdemes abszolut módon meghatározni a kattintható felület határait, pl.: egy fénykép részeire kattintható felületeket létrehozni */ left: 20px; top: 20px; width: 200px; height: 100px; display: block; /* tömb elemre van szükség a méretek szabad meghatározásához */ text-decoration: none; /* nem kérünk a link aláhúzásából */ border: 0; /* nem akarunk keretet akkor sem, hogyha más linkeknek van keretje, pl.: szaggatott aláhúzás */ /*border: 1px solid red; */ /* a beállítások ideje alatt */ } |
Engem inkább az érdekelne hogy milyen plugin kell az ilyen kódok bemutatására!