| Autor | Zpráva | ||
|---|---|---|---|
| slonik Profil |
#1 · Zasláno: 6. 3. 2012, 18:22:59
Omlouvám se za dotaz, ale prostě jsem to nikde nenašel, tak se ptám tady. Chtěl bych si udělat stránku podobnou této: http://tea-bags.mypage.cz/, ale prostě nevím čím začít. Chci mít obrázek v záhlaví a vertikální menu nalevo, ve kterém bude seznam písmen a po najetí na písmeno se rozbalí a objeví se další seznam. HTML umím, ale prostě toto jsem nikde neobjevil.
|
||
| Domek Profil |
#2 · Zasláno: 6. 3. 2012, 18:29:52
slonik:
„HTML umím, ale prostě toto jsem nikde neobjevil.“ Tak to html asi moc neumíš :) No, zkus googlit: Menu html Celou stránku rozřežeš do <divů> a ty nadefinuješ jako třídy / nebo identifikátory v css. Je to jednoduchý, ale chce to si rozmyslet, jak tu stránku rozdělíš. Věnuje se tomu plno webů.... |
||
| slonik Profil |
Vytvořil jsem si tedy podle různých návodů stránku se záhlavím, bočním menu a textem, který se ale podivně posune dolů a nechce zůstat vedle menu. Zde je celý kód:
<style type="text/css" media="all">
body {margin:0; padding:0;
background:#ffffff;
text-align:center;}
#hlavicka {padding: 10px;
border: 1px black;
background: #dddddd;}
#obalovydiv ul
{margin: 0;
padding: 0;
list-style-type: none;}
#obalovydiv a
{display: block;
color: #FFF;
background-color: #036;
width: 9em;
padding: 3px 12px 3px 8px;
text-decoration: none;
border-bottom: 1px solid #fff;
font-weight: bold;}
#obalovydiv a:hover
{background-color: #369;
color: #FFF;}
#obalovydiv li li a
{display: block;
color: #FFF;
background-color: #69C;
width: 9em;
padding: 3px 3px 3px 17px;
text-decoration: none;
border-bottom: 1px solid #fff;
font-weight: normal;}
#obsah {width: 90%;
margin:1em auto;
border: 1px solid blue;
text-align:left;
max-width: 1024px;
background: url('blueyellow.gif') top left repeat-y;
#hlavnipanel {margin:0 0 0 200px; padding:0;}
#hlavnipanel-obsah {margin:0; padding: 0.5em 1em;}
#paticka {padding: 10px; border-top: 1px solid blue; background: #dddddd;}
hr.cleaner {clear:both; display: none}
</style>
</head>
<body>
<div id="obsah">
<div id="hlavicka"><img src="caje.jpg" alt="caje.jpg, 176kB" title="Caje" border="0"></div>
<hr class="cleaner" />
<div id="obalovydiv">
<ul>
<li><a href="#">hlavni</a>
<ul>
<li><a href="#">pod</a></li>
</ul>
</li>
<li><a href="#">hlavni</a>
<ul>
<li><a href="#">pod</a></li>
</ul>
</li>
<li><a href="#">hlavni</a>
<ul>
<li><a href="#">pod</a></li>
</ul>
</li>
</ul>
</div>
</div>
<div id="hlavnipanel">
<div id="hlavnipanel-obsah">
Posunutý text.
</div>
</div>
<hr class="cleaner" />
<div id="paticka"></div>
</div>
</body>
</html> |
||
| jenikkozak Profil |
#4 · Zasláno: 6. 3. 2012, 20:32:07
slonik:
Div #hlavnipanel dej do divu #obalovydiv pod ten seznam <ul>.
Seznamu nastav šířku a float:left.
Divu #obalovydiv nastav overfloat:hidden.
Pokud jsem ovšem pochopil, že chceš dosáhnout toho, aby posunutý text byl vedle menu. Jestli ne, tak ti každopádně na řádku 45 chybí uzavírací složená závorka. |
||
| slonik Profil |
#5 · Zasláno: 6. 3. 2012, 20:53:09
Děkuji za pomoc, ale omlouvám se, prostě nevím kam to dát... Těch #obalovydiv je tam víc a nevím, do kterého to patří a "Div #hlavnipanel dej do divu #obalovydiv pod ten seznam <ul>" jsem vůbec nepochopil. A ano chci, aby byl text vedle menu.
|
||
| jenikkozak Profil |
#6 · Zasláno: 6. 3. 2012, 21:21:36
slonik:
„Těch #obalovydiv je tam víc a nevím, do kterého to patří a "Div #hlavnipanel dej do divu #obalovydiv pod ten seznam <ul>" jsem vůbec nepochopil.“ Myslel jsem to tak, že řádky 82 - 86 dáš na řádek 80. Tedy za poslední značku </ul>. Myslel jsem totiž, že bys chtěl ten text „Posunutý text“ dostat také do toho modrého rámečku, který patří divu #obsah.
|
||
| Someone Profil |
slonik:
„prostě nevím kam to dát“ Jestli se chceš naučit tvořit stránky, tak vřele doporučuji tento způsob tvorby zahodit, vzít si prázdnou stránku a začít tvořit pomalinku, postupně div po divu. Pokud ti jde o to, aby stránky vypadaly protože jsi řádek 40 prohodil s řádkem 42 a přitom si něměl tušení proč. Tak je tento komentář bezvýznamný. |
||
|
Časová prodleva: 12 let
|
|||
0