| Autor | Zpráva | ||
|---|---|---|---|
| vinnetou Profil |
#1 · Zasláno: 9. 4. 2010, 07:46:24
Sorry za poslední příspevek, a sry ze jeste otravuju. Ja ted zacinam pozicovat a nevim jak udelat kdyz am tu stranku sirokou treba 1024px aby byla vždy na prostředku. Dik :D
|
||
| pavuk Profil |
#2 · Zasláno: 9. 4. 2010, 07:49:18 · Upravil/a: pavuk
obal jí <div>em kterýmu nastav
{margin: auto} |
||
| Trejpa Profil |
#3 · Zasláno: 9. 4. 2010, 08:17:43
vinnetou:
Samotný margin: auto ti nepomůže. Běžně se to dělá takto. V případě (zavrhovaného) pozicovaného layoutu ani to nestačí. Tam se musí pozicovat od toho vystředěného bloku, tedy nastavit mu position: relative (bez top a left). |
||
| vinnetou Profil |
#4 · Zasláno: 9. 4. 2010, 13:45:30
jenze bych chtel aby se to vsem zobrazovalo uprostred, at maj jakykoliv rozliseni
|
||
| Trejpa Profil |
#5 · Zasláno: 9. 4. 2010, 13:48:26
vinnetou:
Přečti si [#3] ještě jednou. |
||
| vinnetou Profil |
mam to teda takhle obalit do divu:
<body><div id="all"> ...obsah stranky... </div></body> a do css zadat: body {
text-align: center; /*vycentrovanie pre IE*/
}
#all {
width: 760px; /*šírka layoutu*/
text-align: left; /*zrušenie vycentrovania textu*/
margin: 0 auto; /*vycentrovanie v ostatných prehliadačoch*/
}??? Moderátor Davex: Vkládej prosím kódy mezi značky [pre] a [/pre] (stačí kliknout na
 ). |
||
| Trejpa Profil |
#7 · Zasláno: 9. 4. 2010, 15:03:04
vinnetou:
Ano. A pokud používáš k rozmístění prvků na stránce (nevhodnou) metodu pomocí position: absolute, tak ještě do #all přidej position: relative, které způsobí, že všechny v něm obsažené absolutně pozicované prvky budou svoji pozici odvozovat od něj namísto od body. |
||
| vinnetou Profil |
hlavni strana:
<html> <head> <link rel="stylesheet" type="text/css" href="styly.css"> <title>Hlavní strana - Runescape</title> </head> <body> <table class="table1" border="1" cellpadding="3" bordercolor="black" bgcolor="#003030"> <tr><td><h1>Runescape</h1></td></tr> </table> <table class="table2" border="1" cellpadding="3" bordercolor="black" bgcolor="#003030"> <tr><td valign="top"> <table> <caption>MENU:</caption> <tr><td><a href="index.html" title="Hlavní strana">Hlavní strana</a></td></tr> <tr><td><a href="questy.html" title="O postavě Lurid Ghost">Splněné Questy</a></td></tr> <tr><td><a href="fotogalerie.html" title="Fotogalerie">Fotogalerie<a/></td></tr> </table> </table> <table class="table3" border="1" cellpadding="3" bordercolor="black" bgcolor="#001616"> <td> <h1 style="color:yellow;">Vítejte na mých stránkách</h1> <p>Tyto stránky jsou z drtivé většiny o mé postavě v Runescape, což je super MMORPG*. <br>*MMORPG - Massive Multiplayer Online Role-Playing Game je počítačová hra na hrdiny o více hráčích (tzv. Multiplayer),<br> která umožňuje tisícům hráčů po celém světě být duchem v jeden čas na jednom místě. Ve zpravidla fiktivním virtuálním světě skrze Internet. MMORPG hry jsou odnoží online her. MMORPG můžeme volně vyložit/přeložit jako Hromadná Online hra na hrdiny.</p> <a href="http://www.rsbandb.com/"><img src="http://www.rsbandb.com/sigs/sig33/lurid_ghost.png" title="Skilly" border="0"></a> </td></tr> </table> <table class="table4" border="1" cellpadding="3" bordercolor="black" bgcolor="#003030"> <tr><td> <br></td></tr> </table> </body> styly: p {color: #00bbbb; text-indent: 20px;}
a:link, a:visited {text-decoration: none}
a:link {color: Aqua;}
a:visited {color: Aqua;}
a:active {color: Aqua;}
caption {color: #00CC00;}
h1 {color: white; font-family: arial black; text-align: Center;}
h2 {color: #336688;}
h3 {color: #CC00FF;}
h4 {color: #33CC66;}
li {color: #00bbbb;}
.table1 {position: absolute; width: 1024px; top: 0px; height: 60px; left: 0px; }
.table2 {position: absolute; width: 124px; top: 60px; left: 0px; height: 500px;}
.table3 {position: absolute; width: 776px; top: 60px; left: 124px; }
.table4 {position: absolute; width: 124px; top: 60px; left: 900px; height: 500px;}
body {background-color: #001616; margin: auto;}dal sem to tam jak si rikal a nefungovalo to (tady to neni) |
||
| panther Profil |
#9 · Zasláno: 9. 4. 2010, 16:39:38
vinnetou:
„dal sem to tam jak si rikal a nefungovalo to (tady to neni)“ muselo to fungovat. Dej sem to, co nefungovalo a co jsi zkoušel. |
||
| pavuk Profil |
#10 · Zasláno: 9. 4. 2010, 16:42:06 · Upravil/a: pavuk
Ve tvým kódu Trejpovo radu nemáš zakomponovanou... Ale protože zároveň píšeš že „(tady to neni)“, tak nechápu proč jsi sem dával kód
týhle stránky. Raději sem dej odkaz na stránku. Pokud napíšeš správně za <body> vejš [#3] uvedený deklarace (i v týhle stránce) a do stylu k #all navíc {position: relative}edit.: pozdě.... |
||
| vinnetou Profil |
<html> <head> <link rel="stylesheet" type="text/css" href="styly.css"> <title>Hlavní strana - Runescape</title> </head> <body><div id="all"> <table class="table1" border="1" cellpadding="3" bordercolor="black" bgcolor="#003030"> <tr><td><h1>Runescape</h1></td></tr> </table> <table class="table2" border="1" cellpadding="3" bordercolor="black" bgcolor="#003030"> <tr><td valign="top"> <table> <caption>MENU:</caption> <tr><td><a href="index.html" title="Hlavní strana">Hlavní strana</a></td></tr> <tr><td><a href="questy.html" title="O postavě Lurid Ghost">Splněné Questy</a></td></tr> <tr><td><a href="fotogalerie.html" title="Fotogalerie">Fotogalerie<a/></td></tr> </table> </table> <table class="table3" border="1" cellpadding="3" bordercolor="black" bgcolor="#001616"> <td> <h1 style="color:yellow;">Vítejte na mých stránkách</h1> <p>Tyto stránky jsou z drtivé většiny o mé postavě v Runescape, což je super MMORPG*. <br>*MMORPG - Massive Multiplayer Online Role-Playing Game je počítačová hra na hrdiny o více hráčích (tzv. Multiplayer),<br> která umožňuje tisícům hráčů po celém světě být duchem v jeden čas na jednom místě. Ve zpravidla fiktivním virtuálním světě skrze Internet. MMORPG hry jsou odnoží online her. MMORPG můžeme volně vyložit/přeložit jako Hromadná Online hra na hrdiny.</p> <a href="http://www.rsbandb.com/"><img src="http://www.rsbandb.com/sigs/sig33/lurid_ghost.png" title="Skilly" border="0"></a> </td></tr> </table> <table class="table4" border="1" cellpadding="3" bordercolor="black" bgcolor="#003030"> <tr><td> <br></td></tr> </table> </div> </body> styly: p {color: #00bbbb; text-indent: 20px;}
a:link, a:visited {text-decoration: none}
a:link {color: Aqua;}
a:visited {color: Aqua;}
a:active {color: Aqua;}
caption {color: #00CC00;}
h1 {color: white; font-family: arial black; text-align: Center;}
h2 {color: #336688;}
h3 {color: #CC00FF;}
h4 {color: #33CC66;}
li {color: #00bbbb;}
.table1 {position: absolute; width: 1024px; top: 0px; height: 60px; left: 0px; }
.table2 {position: absolute; width: 124px; top: 60px; left: 0px; height: 500px;}
.table3 {position: absolute; width: 776px; top: 60px; left: 124px; }
.table4 {position: absolute; width: 124px; top: 60px; left: 900px; height: 500px;}
body {background-color: #001616; margin: auto;}
body {
text-align: center; /*vycentrovanie pre IE*/
}
#all {
width: 1024px; /*šírka layoutu*/
text-align: left; /*zrušenie vycentrovania textu*/
margin: 0 auto; /*vycentrovanie v ostatných prehliadačoch*/
} |
||
| Trejpa Profil |
#12 · Zasláno: 9. 4. 2010, 18:12:16
vinnetou:
Napíši to potřetí a naposledy. Přidej: #all { position: relative; }Poznámka: Nechtěl bys #all (široký 760 px) trochu zvětšit, aby do něj vlezl třeba .table1 (široký 1024 px)? |
||
| panther Profil |
#13 · Zasláno: 9. 4. 2010, 18:32:32 · Upravil/a: panther
Trejpa:
„Nechtěl bys #all (široký 760 px) trochu zvětšit, aby do něj vlezl třeba .table1 (široký 1024 px)?“ zvětšit a zároveň zúžit .table1 tak, aby se vešel na monitor 1024x... :o) |
||
| vinnetou Profil |
#14 · Zasláno: 9. 4. 2010, 18:40:25
uz to jde dik
|
||
| Trejpa Profil |
#15 · Zasláno: 9. 4. 2010, 18:44:09
panther:
Detail. Sám bych se u pevného layoutu přiklonil k 960 px. Nicméně je na každém, aby si zvážil výhody toho kterého rozměru. Ale ano, vinnetou by si mohl uvědomit, že výsledný layout musí být užší, než předpokládaná velikost okna prohlížeče (nebo rozlišení monitoru). |
||
| vinnetou Profil |
ja vam ted moc nerozumim, jako že to mam moc široky dohromady, mam snizit z tech 1024 treba na 1000px?
a mohli byste by trochu vysvetlit ten layout a tohle: body {
text-align: center; /*vycentrovanie pre IE*/
}
#all {
width: 1024px; /*šírka layoutu*/
text-align: left; /*zrušenie vycentrovania textu*/
margin: 0 auto; /*vycentrovanie v ostatných prehliadačoch*/
}moc děkuji Moderátor Joker: Vkládej prosím kódy mezi značky [pre] a [/pre] (stačí kliknout na
). |
||
| Trejpa Profil |
#17 · Zasláno: 9. 4. 2010, 19:43:30
vinnetou:
Tak nějak. Zamýšlíš-li stránky pro uživatele s monitorem od šířky 1024 px, musí být samotná stránka užší (minimálně o šířku svislého posuvníku). Řekněme, že tvůj monitor (a nesprávně předpokládáš, že i monitor ostatních návštěvníků) má na šířku rozlišení 1024 bodů. Kdyby si návštěvník s tímto monitorem prohlížel tvůj web, tak se mu tam téměř nikdy nevleze. Protože: · okno není maximalizované (má vedle něj ICQ, hudbu, miniaplikace; nebo neví, že lze maximalizovat) · okno je maximalizované, ale má svislý posuvník (cca 16 px) · okno je maximalizované, ale má v sobě svislé podokno se záložkami, historií nebo jiným doplňkem prohlížeče · plus cokoliv jiného – nikdy nesmíš předpokládat, že si tvůj návštěvník prohlíží tvé stránky stejně, jako ty |
||
| vinnetou Profil |
dik za vysvetleni...dobre tak to dam aspon na 1000px nebo existuje nejaky nastaveni pri pozicovani aby to vzdy bylo na 100% okna? i když to je minimalizovane?
a pls jeste ten layout a tohle: body {
text-align: center; /*vycentrovanie pre IE*/
}
#all {
width: 1024px; /*šírka layoutu*/
text-align: left; /*zrušenie vycentrovania textu*/
margin: 0 auto; /*vycentrovanie v ostatných prehliadačoch*/
}děkuji Moderátor Joker: Vkládej prosím kódy mezi značky [pre] a [/pre] (stačí kliknout na
). |
||
| pavuk Profil |
#19 · Zasláno: 9. 4. 2010, 19:53:59
Vysvětlení toho layoutu máš právě v těch komentářích který jsou do něj vložený
|
||
| vinnetou Profil |
#20 · Zasláno: 9. 4. 2010, 19:59:22
v jakejch komentarich?
|
||
| pavuk Profil |
#21 · Zasláno: 9. 4. 2010, 20:04:41
Komentáře jsou ten text mezi /* a */
|
||
| vinnetou Profil |
#22 · Zasláno: 9. 4. 2010, 20:20:45
ja aha :D, ale stejne nevim co to je layout, stacil by mi i jen nejakej odkaz na clanek
|
||
| panther Profil |
#23 · Zasláno: 9. 4. 2010, 20:22:41
vinnetou:
„ale stejne nevim co to je layout“ tak hledej. Pokud máš základy angličtiny, z názvu by ti to mohlo dojít taky. |
||
| Chamurappi Profil |
#24 · Zasláno: 9. 4. 2010, 20:34:20
Reaguji na vinnetou:
Všichni ostatní ten pojem chápou tak nějak intuitivně, zkus si prohlédnout ukázku na odkázané stránce, trochu se nad tím zamyslet (a třeba i trochu zaexperimentovat) a třeba ti to také docvakne. „i když to je minimalizovane?“ U minimalizovaného okna se nepřepočítávají rozměry, poněvadž není vidět. Reaguji na panthera: „Pokud máš základy angličtiny“ Slovník Lingea Lexicon mi říká, že layout je „(situační) plán, nákres, návrh, projekt, dispozice“. To jsem ani netušil :-) |
||
| vinnetou Profil |
#25 · Zasláno: 9. 4. 2010, 22:28:57
No...dik ste mi teda pomohli. Co je layout sem se zase nedozvedel ani ze slovníku (struktura, uspořádat, rozmístit, uspořádání, rozmístění)
ani z www.jakpsatweb.cz (CSS vlastnost table-layout určuje způsob výpočtu šířky buněk - Způsob výpočtu šířky buněk???). Asi si rikate že jsem nějakej blb, já se vám onlouvám, sem vážně blb, dělám www stránky teprv měsíc. Vše mi jakžtakž jde, ale tohle nechapu a jen vas prosim o vysvětlení co je obecně layout, na co se používá a k čemu je. Nebo mi ulpne stačí odkaz na začátečníku srozumitelný článek. Děkuji za pochopení |
||
| Trejpa Profil |
#26 · Zasláno: 9. 4. 2010, 22:52:09
vinnetou:
Slovem layout se opravdu myslí to, co jsi našel ve slovníku. Jde o strukturu stránky, tedy jak budou rozmístěny její prvky. Zejména řeší způsoby, jak na stránce umístit prvky do sloupečků a vystředit ji. Toho lze dosáhnout několika způsoby: 1) Rámcový layout – starý způsob, nedoporučuje se z důvodu špatného vyhledávání 2) Tabulkový layout – také zavrhovaný způsob, kdy se jednotlivé prvky umístí na stránku v jedné velké tabulce 3) Absolutně pozicovaný layout – méně doporučovaný způsob, nevhodný pro začátečníky, protože se v něm dá nadělat spousta chyb 4) Plovoucí layout – v současné době asi nejvíce preferovaný způsob (můj příklad) A vlastnost table-layout do toho nepleť, ta s obecným návrhem (layoutem) webu nesouvisí. Určuje, zda má tabulka při určování šířek buněk dávat přednost jejich obsahu nebo nastaveným rozměrům. |
||
| vinnetou Profil |
#27 · Zasláno: 9. 4. 2010, 23:28:52
Ha, konečně někdo! Moc dik trejpo :) to sem potřeboval, dík za pomoc
|
||
| vinnetou Profil |
#28 · Zasláno: 11. 4. 2010, 14:47:09
mam jeste jeden problem. cely moje stranky jsem udelal pozocovanim aby se nenacityly pomalu, no a ono nic. NAcita se to cely najednou jako kdyby to bylo delany jednou tabulkou. pls poradte co s tim. Dik URL: http://vinnetou.wz.cz/
|
||
| panther Profil |
#29 · Zasláno: 11. 4. 2010, 14:55:50
vinnetou:
co se načítá najednou? Mě se stránka načítá celkem normálně. |
||
| vinnetou Profil |
#30 · Zasláno: 11. 4. 2010, 15:21:15
rychle? já myslel jako že když udělaáš stránku v jedný tabulce, tak IE ceka az se nacte cela a je to pomaly. A kaskadovejma stylama by se to melo nacitat po kouskach, ale neni to tak, treba ta fotogalerie, cekas a z potom se nacte cela, jen obrazky jsou postupne
|
||
|
Téma pokračuje na další straně.
|
|||
Toto téma je uzamčeno. Odpověď nelze zaslat.
0