layout stránky v CSS
dělám stránky v CSS, chtěl bych mít stránku na středu obrazovky , a na stránce tři sloupce v prostředním obsah a pokrajích menu .. nevím jak to sformátovat, na střed to jde ale tri sloupce vedle sebe a v nich různý obsah mi nejde, nevíte jak to udělat v css?
(pak mě jeste napadlo to dát celé to tabulky <table><tr>.. ale radši bych to v css když je i zbytek)
děkuju za rady
Skús pohľadať na Google, je tam veľa príkladov: three column layout
Bože, tabuľkový layout - len to nie!
Ja som to riešil takto (nechce sa mi to vysvetľovať
):
Proste celý obsah webu bol v <div id="page"></div> a tá šírka 775px je optimalizáciou pre rozlíšenie 800x600 a vyššie.
A tri stĺpce? To sa mi tiež raz podarilo.
No nepoužíval som ich tak často a nenapadá ma, v ktorom mojom zdrojáku by som ich našiel.
Netreba nič googliť! Stačí si nad tým chvíľu posedieť, porozmýšľať a poskúšať... Teda ak vieš základy CSS a chceš si urobiť vlastný layout.
Třeba takto
vznikne tohle
Samozřejmě se musí doladit výšky.
udělal jsem to podle tebe, ale mám menší problám s tím když v krajním divu (pravy) dam pozadi a nedam tam zadny text tak se nezobrazí , jak by se dalo udělat aby se ty krajni divy natahovaly podle velikosti prostredniho ?
Však jsem psal, že se musí poladit výšky. Na "automatiku" nevím, jak to udělat. Pokud se ti nezobrazuje prázdný <div>, dej tam alespoň pevnou mezeru.
<div class=pravy> </div>
díky, tak to už mám.
ještě bych se chtěl zeptat jestli můžu div s fixed pozicí a z-indexem=2 zapozicovat v pixelelech od středu stránky
tedy aby ten div začínal třeba 50px od prostředka stránky a obsah by měl zarovnaný na levo
jediný co mě napdlo je rozšířit ho o stejný kus na druhou stranu,dát transparentní pozadí a nechat ho na středu, ale nevím jestli tim překrytím obsahu pod ním (teda z index 1) nebude nejak omezovat (jako zmena odkazu po najeti mysi apod..)
css-pozicovani.html
Na interval.cz je knihovna css. Nevím, jestli je tam přesně to, co chceš ty, ale jako inspirace je to vynikající.
Neviem ako CSS, ale iné seriály (napr. o PHP) na Interval.cz sa mi zdali byť príliš komplikované. Ako keby ich písali pre profesionálov, ktorí len niečo zabudli a chcú si to zopakovať. Preto som vždy hľadal články na iných weboch a Intervalu som sa vyhýbal.
A chudák pixy s stím dal takovou práci...
www.wellstyled.com
[img]layzo9.gif[/img]
takhle bych chtěl mít layout
cervene - je to co je tam dany na pozadi pomoci background
modre - je logo
zelene - jsou obrazky co ohranicuji obsah
zluta - obsah
udelal sem to podle Kráti ale chtěl bych aby se to samo natahovalo podle velikosti obsahu, ted bych musel na každé stránce přepočítávat pixely kvuli velikostem
v tabulkovym layoutu by to slo udelat lepe a mene textu tak proc se to nedela ?
Třeba proto, že je to naprosto nelogické. Musíš vnímat rozdíl mezi struktuními (např. strong, em) a vzhledovými (např. b, i) značkami. Strukturní značka přikládá svému obsahu nějaký význam, například, že je důležitý (strong), kdežto vzhledová, že má jen nějak vypadat (b). To je však na prd, poněvadž, jak se má strojově posuzovat významnost nějak vypadajícího textu? Stroj nemá takřka žádnou představu o tom, jak vypadá významné. Narozdíl od člověka, asi to souvisí i s inteligencí. Když ve Wordu napíšeš řádek tučným písmem o 20 bodech, tak člověk pozná a pochopí (nebo v opačném pořadí?), že je to nadpis a dokonce určí i jeho postavení v hierarchii nadpisů. Ale tomu pitomýmu programu musíš říst pomocí stylů, že je to nadpis a je součástí osnovy a teprve pak z toho dokáže vygenerovat obsah.
Tabulka představuje nějaké strukturované schéma, nějaký přehled nebo tak něco. Jakmile ji použiješ na design, tak popřeš její význam. Ale s tím významem počítají například zobrazovací zařízení nevidomých, které zančku table předčítají jako logicky strukturované schéma. Zkus si nějakou designovou tabulku přečíst se zavřenýma očima (no, to ti spíš bude muset přečíst někdo jiný, že) řádek po řádku a uvidíš, že si jen těžko představíš, o co jde. A když do toho zapleteš tabulku vnořenou do buňky (table do td)...
Další důvod je celkem nepřehledný kód, zvláště u strukturovanějších designů, ale je pravda, že to je taky možná otázka zvyku.
Další důvody se dají určitě vygooglit.
jde mi spíš o to jak to udělat aby se to natahovalo podle výšky obsahu
Pokud tam nikde nezmíníš vlastnost height, tak se ti to snad takhle natahovat bude. Problém spíš bývá mít patičku vždy na dolním okraji okna i s malým textem.
s patičkou problám není tu sem vygoogloval ale stejně textu bude na každé stránce dost.
když nezmíním výšky tak se to celé rozhází.
A je to velký problém dopsat tam nakonec 3 stejná čísla podle toho nejdelšího?
kam ?
asi místo tohohto height: 1200; a třetí přidat na to ".centre". Nestudoval jsem to.
Když se ptáš kam máš zadat výšku, aby to bylo stejně vysoké, pravděpodobně vůbec netušíš co vlastně děláš. Podívej se na www.jakpsatweb.cz na CSS alespoń na úplné základy a třídy (class).
to tuším .. ale když tam zadám třetí výšku . a do prostředního sloupce pak dám ještě další elementy řekněme další "tabulku" o 3 řádcích a 3 sloupcích tak jim taky musím dát výšku podle jejich obsahu takže bych pak měnil spousty výšek a když budu mít hodně stránek a na každé jinak dlouhý obsah .. který se u některých stránek bude možná i denně měnit tak bych potřeboval layout který se natahuje podle obsahu .. jako je tomu u <table>
Když to tušíš, tak jistě víš, že můžeš všechno hodit do externího stylopisu a na jednotlivých stránkách, když je děláš, zadat výšku přímým stylem:
No a pak se koukneš v náhledu a ta tři čísla doladíš podle nejdelšího - 20 vteřin práce. 50 stránek = asi tak 20 minut celkem.
v externím stylopisu to mam .. ale když bude každá stránka jinak dlouhá a bude jich 50 tak nevim,, jak to chceš udělat ??
Čeho bude 50?
Stylopis bude jen jeden a přímo v každé stránce dáš ten kousek přímého stylu jak jsem psal výše.
a v čem mi ulehčí externí stylopis ?? stejně to budu v každé stránce muset ručně přepsat což nechci.
nejsou to jen 3 vejšky maám tak pak ještě vnořenou "tabulku" a u té musim měnit taky a u 50 stránek to pak je na strasne dlouho .. jeste kdyz se obsah bude csto menit
Nejlepší asi bude, když si to uděláš celé v tabulce a až přijdeš na to, proš to mít třeba v <div>, předěláš to. Alespoň se pak trošku procvičíš, protože to dá děsnou práci.
ja to v divu mam .. protoz to je moderni atd. ale chtěl bych natahovací layout jako je to u tabulky a jestli mi nedokážete poradit tak to přiznjete !
Nejdříve zkus pochopit, že každý div je samostatný. Aby se všechny natahovaly naráz stejně podle nejdelšího opravdu neumím.
Pokud děláš nějaký web velké firmy s padesáti položkami v menu, jistě si to budeš umět najít (za ty prachy bych si to také našel). Pokud děláš nějaký svůj osobní webík s dvaceti stránkama, udělej si to celé v té tabulce a ušetříš si napsání šedesáti čísel (až to budeš předělávat napíšeš/smažeš těch znaků 60 000). Evidentně vůbec nic o CSS netušíš. Doporučuji něco počíst, abys byl alespoň v obraze.
Také si to můžeš nechat udělat u profistudia, dělají moc pěkně a samonatahovace (dělají to asi ve Wordu a tam se to natahuje samo).
studio.czweb.org
css umim samozrejme ze ne uplne jako profik ale uživatelsky jak psat web.cz mam prectenej celej, jen sem se tu chtěl zeptat na layout, protože sem zatim dělal layouty jen v ramcich a jeden v tabulkach css sem pouzival na formatovani textu atp..
kazdej huci ze layout v tabulkach je hnus atd. a co je na tom ?? objem dat je menší, to co ted chci delat by tam slo za pár okamžiků a přehledně, nemusel bych měnit výšky divů.
tak ja vas fakt nechapu to je porad udelaj to v css, ale poradit mi numite
(budu mit osobni stranky ale hodně obsahu který se mění, a na to aby mi to udělal profik nemam prachy, to radsi udelam v tabulkach)
I tabulky mohou být formátované v CSS. Přečti si to ještě tak 5x. Není CSS=<div>. V kaskádových stylech děláš především vzhled čehokoli.
Tabuľky sú pre základnú kostru stránky nepoužiteľné pre neprehľadnosť takého zdrojového kódu, ale aj (hlavne) z hľadiska sémantiky. Je o tom množstvo článkov na rôznych blogoch.
Vlakový layout naozaj nie je dobrým riešením, hlavne do budúcnosti. Ale ako začiatočník ho kľudne použi. Ja som tak tiež začal. Najprv jednoduchá stránka vo Worde, neskôr HTML 4.01 s tabuľkovým layoutom v Notepade, potom stále statický web v XHTML 1.1 (s externým CSS) s trochou PHP, a nakoniec už len dynamický web v XHTML 1.1, CSS 2, PHP 5 a s využitím MySQL 5.
Keby som mal času, tak by som šiel aj do AJAXu a vytvoril nejaký pekne vyzerajúci a dobre fungujúci CMS (využívajúci všetko čo som tu napísal), no musel som prejsť na klasické programovanie v Delphi. 
Prečo tomu hovoria vlakový? ... <td></td> <td></td> <td></td> <td></td>