!fontos; linkek
2006 november 19. | Szerző: Holli
Egy linkről akkor ordít a linkség, ha kék színű, és alá van húzva. Csak ilyenkor nem elég szép, az a baj.
Lehet a linkekkel sok mindent csinálni, eltüntetni az aláhúzást, kiszínezni, képekkel helyettesíteni, villogtatni, mittudomén. Azért arra jó vigyázni, hogy az arra járók sejtsék, hogy amit látnak, az nem sima szöveg, hanem egy link.
Az enyém egy aranyos kis honlapocska, különben is oda van írva, hogy “Linkek”, úgyhogy nem gond, ha ezeket is pirosra színezem, megvastagítom, és eltüntetem az aláhúzást:
a {
text-decoration: none;
font-weight: bold;
color: #CC0033;
}
Másmilyen kinézetet szeretnék azoknak a linkeknek, amire mostanában rákattintott a látogató, ezért a látogatott linkek szürkék lesznek:
a:visited {
text-decoration: none;
color: #888888;
}
Amelyik link felett éppen ott áll az egér, az legyen aláhúzva:
a:hover {
text-decoration: underline;
color: #CC0033;
weight: bold;
}
Most még magát a link-blokkot kell megformáznom. Nem szeretném az elejükre a mostani kis pöttyöket, és a cím alá akarom őket igazítani, mert most jobbra be van húzva az összes linkem. Nullára állítom a margót:
ul {
margin: 0;
list-style-type: none;
}
Így most akkor minden oké, a pöttyök eltűntek, a piros, félkövér betűs linkek balra igazodnak, egérrel föléjük állva aláhúzódnak, látogatva beszürkülnek. Explorerrel.
Az Opera és a Firefox behúzva hagyta a listát. Egy érdekes trükk jön, amire magamtól soha az életben rá nem jöttem volna, viszont már találkoztam vele: nem ugyanazt az utasítást kapja az Explorer, mint a többi böngésző. Két margós sorom lesz:
ul {
margin: 0 0 0 -35px !important;
margin: 0; /*IE*/
list-style-type: none;
}
Az “!important” jelzés semmit nem mond az IE6-nak, ezért tovább ugrik a következő sorra. A többi böngésző is tovább ugrana, és az utolsó variációt fogadná el, csakhogy nekik szóltam, hogy az újabb utasítással ne foglalkozzanak, mert az első a fontos. Így most nálam mindhárom böngészővel egyforma a kinézet, itt lehet megnézni.
A tutorial-on találtam egy jó kis példát, ki lehet próbálni, itt a háttér színe változik meg, ha egérrel rámegyünk a linkre. (Picike megnyugvás nekem, hogy ez se mutat szépen Firefoxszal és Operával…)
Nem a pöttyös az igazi
2006 november 18. | Szerző: Holli
Feladom most ezt a pöttyös témát, majd esetleg egyszer kisütöm, hogy mi bajuk van vele a böngészőknek.
Visszaléptem egyet, töröltem a kereteket és a háttereket, kicsit tologattam a margókat, a tetejére egy kis virág, és kész is a hangulatjavító stíluslap, klikk ide.
Szokás szerint a böngészőnek a Nézet – Forrás menüpontjában lehet megnézni a honlap forráskódját. Érdekesség csak a felső blokkban, a címsorban van, az így néz ki:
h1 {
height: 240px;
border-bottom: 6px double #CC0033;
line-height: 200px;
padding-left: 100px;
text-align: left;
font-size: 60px;
background-image: url(https://stilus.cafeblog.hu/files/pirosv.jpg);
background-position: top right;
background-repeat: no-repeat;
}
Ide tettem be háttérképnek egy 240 pixel magas képet, ezért a címsornak is meg kellett adnom ekkora magasságot, mivel enélkül nem látszódna a teljes kép.
A háttérképet jobbra és fentre pakoltam, és megadtam az elérési útját. A kép nem ismétlődik.
Elég hihetetlenül hangzik, de a honlap nevével volt a legtöbb probléma. Körbenéztem a neten, hát a stíluslapoknak gyenge pontja a függőlegesen középre igazítás. Meg lehetne oldani margókkal is, csakhogy a különböző böngészők elképesztő különbséget tudnak produkálni margó-ügyben, lásd az előző bejegyzést. Végül is most úgy értem el, hogy a 60 pixeles betűk ne a honlap tetejéhez tapadjanak, hogy sorköznek 200 pixelt adtam meg. (Ez csak ilyen egysoros szövegnél válik be, de más megoldás is van.) Szerintem egész helyes lett.
Újbejegyzés-helyettesítő bejegyzés
2006 november 18. | Szerző: Holli
Hehh. Elvonulok olvasgatni, mielőtt kisütném, hogy a honlapgyártás leginkább a boszorkánysághoz hasonlít.
Mert itt van például a háttér, az egy olyan sima területe szokott lenni a sablonmódosítgatásoknak, hogy csak az nem piszkálja a hátterét, aki nem akarja. Erre most összehozom a honlapocskám összehátterezett változatát, katt ide. Explorer alatt még hagyján, szinte úgy néz ki, ahogy terveztem: a háttérben decens szurke minta, a címnél egy piros pötty baloldalt, a linkeknél egy piros pötty a jobb felső sarokban, a szövegnél meg piros pötty-sorozat a jobb szélen. Igazán apróság, hogy baromi nagy hely van a két blokk közt. Nade. Operában, Firefoxban híre-hamva nincs a pöttyeimnek, és még a linkfal is lecsúszott, nem volt elég neki a hely.
Marginális probléma a lecsúszás, csak már elment a kedvem a próbálkozástól, mivel a pöttyökhöz hozzá se tudok szólni… majd jövök 🙂
Korhatáros bejegyzés!
2006 november 17. | Szerző: Holli
A fiataloknak biztosan gyorsabban megy ez az egész. Na de tessék belegondolni, a “Szabad időmben weblapokat készítek” kijelentés kinek a szájából hangzik izgalmasabban, egy gimnazista srácéból vagy egy nagymamáéból.
Képet feltölteni ugyanott lehet, ahol bejegyzést írni. A jobb oldali oszlopban, a Filekezelő-ben a piros csillagos sárga mappa ikonjára kell kattintani.
Feltöltött képet beilleszteni a szövegbe úgy lehet, hogy a jobb oldali képlistánkból kiválasztjuk a nekünk tetszőt, rákattintunk, aztán a bejegyzésszerkesztőben a felső sorban jobbról a negyedik ikonra, a lombos fára kattintunk. A kép ne legyen 460 pixelnél szélesebb, mert tönkreteszi a sablont.
A jobb oldali menüoszlopnak két rovata is van, ahová képet tehetünk: a Blog leírása és a Magamról rovatba. Előbbit a Beállításoknál lehet módosítani, utóbbit a Személyes profil szerkesztésénél. Ide a kép úgy kerül, hogy megadom az elérési útját, például <img src=”https://stilus.cafeblog.hu/files/stilus.png”>.
Linket betenni ide a bejegyzésbe úgy a legegyszerűbb, hogy kimásolom a címsorból, és ide beillesztem. Ekkor rendes link lesz belőle, csak az a hosszú hátétépés izé fog megjelenni a szövegben. Ezt úgy írom át, hogy a szerkesztőablak eszköztárának alsó sorából kiválasztom az utolsó előtti, csavarhúzószerű ikont, arra kattintva megkapom a bejegyzésem html-kódját, ott a linkben két egyforma címet találok, a másodikat tetszés szerinti szövegre cserélem. (Másképp is lehet, de én mindig elrontom, ez viszont biztos… :D)
A jobb oldali menübe úgy teszek be linket, hogy ezt a html-kódot használom. A játszós honlapomon 4 link is található, az egyik ez:
<a href=”https://stilus.cafeblog.hu/”>blogom</a>
A honlapon listázva vannak, itt is ki lehet próbálni <li></li> tagek közé tenni a linkeket. (Lehet vele egy csomó mindent kezdeni, de ez hétvégi téma, a linkcsicsázás.)
Szerintem a kategóriák megjelenítése még nem működik.
De ha már itt vagyok, leírom, hogyan lesz nekem szépen bekeretezve a szövegem. A Beállítások-Sablon menüpontban a head részbe beletettem a szokásos <style type=”text-css”> </style> tageket, közéjük pedig ezt a részt, a névnek ugyanennek kell lennie:
blockquote {
margin: 5px;
padding: 1px 5px;
border: 1px solid #ADBED3;
background-color: #F2F5F9;
}
Vagyis a halványkék idézet egy 1 pixeles keretbe kerül, ahol a külső margó körben 5 pixel, a belső margó pedig alul-felül 1 pixel, bal-jobb oldalon 5 pixel. Ez a rész akkor lép működésbe, ha a szövegrészt kijelölöm, és az eszköztár alsó sorában jobbról az ötödik ikonra, a behúzás növelésére kattintok – egy kis kék jobbranyíl van rajta.
Az élet nem habostorta
2006 november 17. | Szerző: Holli
Elégedett vigyor ül mindig a képemre, ha a képernyőn azt látom, amire számítottam. Az a baj, hogy nem mindig azt látom, amire számítok.
Ennek több oka lehet. Például hülyeséget irkálok, a böngészőnek pedig fogalma sincs, hogy mit kéne neki csinálnia, szerintem. Vagy például az alapgondolat nem rossz, csak becsúszik egy apró gépelési hiba: szóköz kerül oda, ahová nem kéne, lemarad (feleslegesen odakerül) egy kettőspont, egy kacsacsőr, egy idézőjel, egy kapcsos zárójel. No és akkor ott vannak a böngészők, amik előttem ismeretlen okokból nem akarják összehangolni a tudásukat, így aztán előfordulhat, hogy nem is bennem van a hiba, hanem mondjuk Bill Gatesben.
A tegnapi honlappal molyolok. Az egész képernyőt halvánszürkére színeztem:
body {
background-color: #EEEEEE;
}
Magának a honlapnak a hátterét sötétszürkére színeztem, adtam neki egy 6 pixel széles dupla keretet piros színben, és azt mondtam, hogy a képernyőn alul-felül 30 pixel margója legyen, a jobb és bal oldal pedig a meglévő helyen osztozzon (vagyis a képernyő felbontásától függetlenül mindig középen legyen a honlap).
#egeszhonlap {
width: 750px;
margin: 30px auto;
border: 6px double #CC0033;
background-color: #CCCCCC;
}
A szöveg blokk szélességét 350 pixelre csökkentettem, mert most már mindenféle külső és belső margókat is bele kell számolnom a 750 pixel össz-szélességbe, nem csak a tartalmat. A háttérszín fehér lett, és az egész blokk 20 pixelnyi távolságra került a honlap szélétől:
#szoveg {
width: 350px;
background-color: #FFFFFF;
margin: 20px;
}
A linkfalnál és a főcímsorban ugyanígy 20 pixel külső margót és fehér háttérszínt adtam meg:
#linkfal {
background-color: #FFFFFF;
margin: 20px;
}
h1 {
background-color: #FFFFFF;
margin: 20px;
}
Ezek után azt vártam, hogy a halványszürke képernyő közepén megjelenik a sötétebb szürke honlapom, benne a három fehér hátterű szöveges résszel.
A kívánatos látványt csak az Opera nyújtotta. Az Explorert nem tudtam rábírni, hogy középre tegye a honlapot, és a címsor túlnyúlik az alsó két blokkon. A Firefox pedig – nagy megrökönyödésemre – egészen elképesztő kinézetet produkált, az egész honlapra vonatkozó háttér- és kerettulajdonságok csak a címsorban jelentek meg. Ezen a képen jól látni a különbségeket:
A honlap itt található meg, a teljes forráskódja pedig a böngészőnek a Nézet-Forrás menüpontjában.
Akit érdekel ez a stíluslapos honlapgyártás/sablonmódosítás, az töltse le az IE legújabb, 7-es verzióját, mert azt mondják, hogy a 6-oshoz képest sokat javult a stíluslap-kezelése, de amíg senki nem járkál erre a legfrissebb böngészővel, addig én se megyek vele sokra.
Nem nagyon vagyok ám letörve, mivel olyan ez a honlapom, amilyen nekem még sose volt: kétféle szabványnak is megfelel. Erre majd visszatérek.
Mienk a fele sajt
2006 november 16. | Szerző: Holli
Most már aztán tényleg stíluslap jön. Főleg azért, hogy lehessen végre játszani.
Tényleg nem nyúlok a body részhez. De csinálok egy head részt, hogy valahová mégis nyúlhassak. Itt, a head-ben formázom majd azokat az egységeket, amiket a body-ban kijelöltem.
Először is megmondom, hogy stíluslap következik: <style type=”text/css”>, aztán a formázás végén lezárom: </style>. (Másképp is lehet, de most ez a legegyszerűbb.)
Formázni pedig úgy tudok, hogy megmondom, melyik egységben milyen tulajdonságnak milyen értéke legyen. A felépítése vázlatosan így néz ki: egység neve {1.tulajdonság: érték; 2.tulajdonság: érték;}.
Lehet például az egy egységhez tartozó formázásokat egyetlen sorba írni. Nekem az jobban tetszik, amikor minden tulajdonság külön sorban szerepel, kicsit behúzva.
Amikor az egységeket kialakítottam, azt mondtam nekik, hogy div id, ezért most a megnevezésben egy # jön a név elé (a variációk nem egészen világosak nekem, az id elvileg azt jelenti, hogy egyetlen helyen szerepel ez az elem, mindegy, majd kitanulom egyszer).
A honlapom forrásában tehát mindenképpen lesz egy ilyen rész, rögtön az elején:
<html>
<head>
<title>hello holli – alakul1</title>
<style type=”text/css”>
body {
}
#egeszhonlap {
}
#szoveg {
}
#linkfal {
}
p {
}
h1 {
}
h2 {
}
ul {
}
a {
}
a:visited {
}
a:hover {
}
</style>
</head>
Tulajdonképpen minden kellék megvan a honlapcicomázáshoz, már csak a megfelelő tulajdonságokat kell beirkálni, és kész is vagyunk. Ennél a pontnál már érdemes tanulmányozni a szakirodalmat, kettő is van a linklistában.
De ne legyek már hernyó, legalább kezdjem el.
Legyen a honlapon minden karakter és keret színe piros. A színeket többféleképpen tudom megadni, most innen választottam, a táblázatból, ami a lap alján van – ezek a színek minden böngészőben ugyanígy jelennek meg. Alapértelmezett tulajdonság lesz, ezért a body egységhez kerül:
body {
color: #CC0033;
}
(Ez az a pillanat, amikor szinte mindenkinek heurékáznia illik, hogy ó hát akkor tudom, miről van szó, én is tudok stíluslapozni. Így igaz.)
Az egész honlapom férjen el egy 800 pixel széles monitoron is, mivel a látogatók egy részének 800×600 pixel felbontású a képernyője. Nem valami sok a szöveg, legyen akkor 750 pixel széles, bőven kifér rá Gorcsev Iván:
#egeszhonlap {
width: 750px;
}
A szöveg legyen 450 pixel széles, és a honlapnak a bal oldalán legyen. Szeretném bekeretezni. (A keret az nagyon hasznos, ha például elveszítem a fonalat, akkor gyorsan berakok egy keretet, máris látni fogom, hogy merre járok.) A keret legyen 2 pixel széles, sima vonalú, piros. És a szöveg ne tapadjon a kerethez, legyen körülötte 10 pixel üres hely:
#szoveg {
width: 450px;
float: left;
border: 2px solid #CC0033;
padding: 10px;
}
A linkfalam 180 pixel széles legyen, jobb oldalon helyezkedjen el:
#linkfal {
border: 2px solid #CC0033;
width: 180px;
float: right;
padding: 10px;
}
A bekezdés szövege legyen sorkizárt:
p {
text-align: justify;
}
Az oldalam neve se lógjon ki a sorból, neki is legyen kerete és belső margója:
h1 {
border: 2px solid #CC0033;
padding: 10px;
}
Itt tartok most, a honlapomnak kezd honlap-kinézete lenni. Megnézéshez katt ide. A Nézet – Forrás menüpontban előjön a forráskódja, az a Jegyzettömbbe bemásolható, ki lehet rajta mindenféléket próbálni. (Szólok megint, hogy .htm kiterjesztéssel kell elmenteni, akkor a fájlra kattintva úgy fog megjelenni, mint egy honlap.)
Div ide
2006 november 15. | Szerző: Holli
(Bírom, mikor ilyen szellemes címeket agyalok ki.)
Hát akkor essek neki a honlapdíszítgetésnek.
Az a sejtésem, hogy a jól kezelhető honlap titka a jó tagolás. Ezzel a honlappal nem is lesz most gondom, túl sokféleképpen nem tudom tagolni. Logikus ez a felépítés:
A jegyzettömbben a html-kódokat ki kell egészítenem úgy, hogy az oldal végül három fő egységre: elnevezésre, szövegre és linkfalra tagolódjon, ez utóbbi kettőben pedig külön formázható legyen a cím és a konkrét tartalom.
A tagolásnál nagyon vigyázni kell arra, hogy az elsőnek megnyitott elemet kell utolsóként lezárni – ez is jól látszik az ábrán, például az oldal-t jelképező négyszög a név előtt kezdődik, és a linkfal után végződik. Legjobb magát a tagolást is hasonló elrendezésben megcsinálni, akkor könnyen áttekinthető marad a forrás.
A legkisebb egységekkel nem kell foglalkoznom, csak a linklistát teszem <ul> és </ul> tagek közé, ezzel egy úgynevezett rendezetlen listát hoztam létre.
Az összes többi egységet úgy alakítom ki, hogy a bele tartozó elemeket <div id=”valami”> és </div> tagek közé pakolom.
A tegnapi honlapom tartalma így fog változni:
<html>
<title>hello holli</title>
<body>
<div id=”egeszhonlap”>
<h1>Hello, holli</h1>
<div id=”szoveg”>
<h2>Rejtő Jenő: A tizennégy karátos autó (részlet)</h2>
<p>(itt van az idézet a könyvből)</p>
</div>
<div id=”linkfal”>
<h2>Linkek</h2>
<ul>
<li><a href=”https://stilus.cafeblog.hu/”>blogom</a></li>
<li><a href=”mailto:helloholli@gmail.com”>email címem</a></li>
<li><a href=”http://cafeblog.hu/”>cafeblog főoldal</a></li>
<li><a href=”http://www.csszengarden.com/tr/magyar/”>zen garden</a></li>
</ul>
</div>
</div>
</body>
</html>
A honlapnak ehhez a body részéhez többé nem nyúlok. Legalábbis remélem… 🙂
Teszkó gazdaságos látványhonlap
2006 november 14. | Szerző: Holli
Az első blogomat hetekig lestem, míg meg tudtam benne változtatni a betűtípust, később talán az elválasztó csíkot is megvastagítottam, de ez nem biztos.
Mondjam-e vagy mutassam. Inkább mutassam, igaz?
Csinálok egy mutogatós honlapot. Van benne egy rövid szöveg és néhány link, címmel együtt persze.
A honlapomhoz úgy fogok hozzá, hogy itt a Windowsban a Minden program – Kellékek menüpontból kiválasztom a Jegyzettömböt, és megnyitom. Olyasmi, mint egy lebutított word-dokumentum. Beleirkálom, amit szeretnék. Az elejére odateszek egy ilyet: <html>, a végére pedig egy ilyet: </html>, vagyis az első sorban megnyitom, az utolsó sorban pedig lezárom a html-dokumentumot. Elmentem az egészet, tetszőleges néven, de fontos, hogy a kiterjesztése .htm legyen. Ha becsukom, a mappában nálam az Explorer ikonja jelenik meg, és rákattintva megkapom az egész szöveget – hát sajnos teljesen összefolyva, nem úgy, ahogy megírtam. De legalább ráfoghatom, hogy van egy honlapom.
Ha most a Nézet menüpontban a Forrás-ra kattintok, újból visszajutok a Jegyzettömbbe, ott rendesen néz ki a szövegem. Kíméletlenül sorokra bontom, egyúttal minimálisan formázom is, hogy honlap-formájában is normálisan nézzen ki:
– a <h1></h1> jelek (tagek) közt lévő szöveg automatikusan nagyobb lesz, ez történik a többi h betűssel is, csak egyre kisebbek a nagyobbítások
– a <p></p> tagek közé egy bekezdésnyi szöveget teszek, két bekezdés közt mindenképpen sortörés lesz
– az <li></li> tagek közé tett szövegnek lista-kinézete keletkezik
– a <title></title> tagek közé beírt szöveg a képernyő alsó sávjában jelenik meg, ha megnyitom a honlapot.
Ez az egész most így néz ki a jegyzettömbben:
<html>
<title>hello holli</title>
<h1>Hello, holli</h1>
<h2>Rejtő Jenő: A tizennégy karátos autó (részlet)</h2>
<p>”Gorcsev Iván, a Rangoon teherhajó matróza még huszonegy éves sem volt, midőn elnyerte a fizikai Nobel-díjat.
Ilyen nagy jelentőségű tudományos jutalmat e poétikusan ifjú korban megszerezni példátlan nagyszerű teljesítmény,
még akkor is, ha egyesek előtt talán szépséghibának tűnik majd, hogy Gorcsev Iván a fizikai Nobel-díjat a makao nevű kártyajátékon nyerte el,
Noah Bertinus professzortól, akinek ezt a kitüntetést Stockholmban, néhány nappal előbb, a svéd király nyújtotta át,
de végre is a kákán csomót keresők nem számítanak; a lényeg a fő: hogy Gorcsev Iván igenis huszonegy éves korában elnyerte a Nobel-díjat.” </p>
<h2>Linkek</h2>
<li><a href=”https://stilus.cafeblog.hu/”>blogom</a></li >
<li><a href=”mailto:helloholli@gmail.com”>email címem</a></li>
<li><a href=”https://stilus.cafeblog.hu/”>cafeblog főoldal</a></li>
<li><a href=”http://www.csszengarden.com/tr/magyar/”>zen garden</a></li>
</html>
Helyben megnézve pont olyan, mint egy rendes csupasz honlap. Nem valami mutatós, annyi előnye van, hogy minden böngészőben egyformán néz ki, és gyorsan letöltődik, és nem csúszik el semmi a képernyőn. Feltöltöttem ide, a blogomba, ugyanúgy, mintha képet töltenék fel, tessék: https://stilus.cafeblog.hu/files/formazatlan.htm
A Nézet-Forrás menüpontban pedig a jegyzettömbös változat látható, vagyis a honlapnak a forráskódja.
Hétvégére piszkosul felcsicsázom.
Lekonyul, mint aranyoshernyó a szelektoroktól
2006 november 14. | Szerző: Holli
Írja netbarátnő szomorúan, hogy eltöltött egy csomó időt az úgynevezett segítség tanulmányozásával, mégse érti, hogyan lesz ebből honlap.
Hát legegyszerűbben úgy lesz belőle honlap, hogy megmutatjuk a leírásokat a legközelebbi, honlapgyártásban járatos ismerősünknek, és megkérjük őt, hogy dobjon össze nekünk egyet.
A saját kezű előállítás az kicsit macerásabb, viszont jót tesz az önértékelésünknek.
Honlapot készíteni sokféleképpen lehet. Lehet panelekből építkezni, mint például a g-portálon, lehet készen kapott blogsablonban ezt-azt kicserélgetni, biztosan lehet még másképp is, meg úgy is, hogy teljesen szabadon, mindenkitől függetlenül alakítjuk az oldalunkat. Szerintem egy kezdőnek mindenképpen úgy tűnik, hogy ő ilyet soha nem fog tudni csinálni. Pedig de. Legalábbis olyat, amihez nem kell programozói ismeret.
Mondom, amatőr vagyok, még a fogalmakat se feltétlenül úgy használom, ahogyan illene, időnként azt se tudom eldönteni, hogy amit szeretnék, az legalább elvileg megoldható-e. De hát az is tud nagyon finom csokitortát sütni, aki soha semmit nem tanult a lisztek meg térfogatnövelők kémiai tulajdonságairól.
Csakis olyan honlap érdekel, ami néhány egyszerű kódból felépíthető. Valójában a blog is ilyen, illetve annak bonyolult része is van, de azzal nekünk nem kell foglalkoznunk.
Egy egyszerű honlapot is többféleképpen lehet megalkotni.
Szeretnék az oldalamra egy szöveget és egy linklistát. Ezt megoldhatom úgy, hogy minden egyes sorba beleírom, hogy az hogyan nézzen ki: például legyen a betű Mistral típusú, a háttér coral színű, a szöveg középre igazodjon. És megoldhatom úgy is, hogy minden egyes sorba beleírom, hogy hol található az a rész, ahol megadom ezeket a betűtípus-háttér-igazítás-satöbbi tulajdonságokat, vagyis stíluslapot használok. Egy ilyen sima honlapnál az előbbi megoldás jóval egyszerűbbnek látszik, mert ott kevesebbet kell írni. De a honlapok nem ilyen simák, és még ha ilyen simák lennének is, akkor se tudnánk csak úgy lazán egymás mellé pakolni a szöveget és a linkfalat, ahhoz már táblázatot vagy frameket kellene használni.
A stíluslapos megoldás elegáns, logikus, könnyen áttekinthető, más oldalakról is elérhető, egyszerűen módosítható, különben is bele vagyok szeretve, mondtam már.
Folytköv.
Jojjjj a lényeg
2006 november 20. | Szerző: Holli
Minden stíluslapos megoldás átültethető a blogba. A linkek formázása is, természetesen.
A Blogleírásba vagy a Személyes profil szerkesztése rovatba beteszem ezt a részt, ez pont olyan, mint a honlapon a <body> rész. Csak első ránézésre ijesztő, valójában tökegyforma sorok vannak benne, csak a honlapok elérési útjától tűnik bonyolultnak. Ilyen egy linkes sor:
<li><a href=”honlap url-je“>megjelenő név</a></li>
Ez a blognak az összes oldalán látszódni fog: a főoldalon is, a bejegyzések oldalán is és az archív oldalon is.
A blogsablonban pedig megformázom ezt a blokkot, most csak a főoldali sablonban (a Nézet-Forrás menüpontban ez is megnézhető):
A főoldalon látni, hogy a linkeknél a címek sötétkék háttérbe kerültek (az egyetlen alcím jobbra van igazítva), a linkek színe pirosra, háttere pedig fehérre változik, ha egérrel fölé megyünk.
A bejegyzések oldalán (vagyis a bejegyzés címére kattintva, ahol a kommentek is vannak) nem ilyen a linklista, hanem pöttyök vannak a linkek előtt, és egyáltalán, se nem formázatlan alapállapot, se nem olyan, amilyen a főoldalon.
Az benne a jó, hogy ehhez elég volt az első keretes részben lévő blokkot beillesztenem a Blogleírásba vagy a profilba, nem kellett a bejegyzésoldali sablont módosítanom. Erre még majd visszatérek.
Oldal ajánlása emailben
X