Autor Zpráva
Jom
Profil
Pls poradte, vyskusal som uz vela ale vsetky su v niecom zlozite, aky je ten najjednoduchsi?
Mistr
Profil
Jom
díavl ses na http://css.interval.cz
roberta
Profil
http://css.interval.cz/clanky/trisloupcovy-fluidni-layout/
Rellik
Profil *
Jestli chces tak kukni na http://firstpage.wz.cz/?page=css je tam nekolik prednastavenych layoutu stranek... ;)
Jom
Profil
Myslite ze ten na intervale.cz je najjednoduchsi?
player
Profil
Myslite ze ten na intervale.cz je najjednoduchsi?
jo
Jom
Profil
Este otazka, naco sluzi reseter? nasiel som to v niektorych typoch layoutov
habendorf
Profil
Není co řešit. Hlavička, pak jeden float:left, jeden float:right, pro střed nějaký margin z obou stran, vyclearovat, patička a fertig.
Jom
Profil
haben trochu toho vela si toho natlacil na jeden riadok :) skus to popisat blizsie
Anonymní
Profil *
V podstate rekl to, co najdes na tom intervalu. Akorat tam je k tomu pridana omacka v podobe hlavicek a paticek, ktere s klidem vypust.
Doporucuju si ten vzorovy layout rozkreslit na papir a ve vytistenem HTML kodu pospojovat, co je co. Ja tak za 15minüt pochopil pozicovani. Teda skoro, nejake nejasnosti se najdou vzdycky. :-)
pe1
Profil *
v 3-stlpcovom dizajne treba mysliet na to aby:

1. bol layout optimalizovany pre rozne prehliadace
2. bol obsah (telo) stranky nacitane ako prve

Takze odporucam nasledovne:

<html>
<head>
<title>Nazov stranky</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link href="design.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="telo">
<div id="hlavicka">
<a href="/" title=""><span>Hlavička stránky</span></a>
</div>
<div id="divvelky">
<div id="divmaly">
<div id="divprostredny">
<h1>nadpis 1</h1>
<p>text text text text text text text text text text text text text text text text text text text text text text text text text text text text text text </p>
</div>
<div id="lavystlpec">
<menu>
<li><a href="/" title="">menu1</a></li>
<li><a href="/" title="">menu2</a></li>
<li><a href="/" title="">menu3</a></li>
<li><a href="/" title="">menu4</a></li>
<li><a href="/" title="">menu5</a></li>
<li><a href="/" title="">menu6</a></li>
<li><a href="/" title="">menu7</a></li>
</menu>
</div>
</div>
<div id="pravystlpec">
<p>
pravý stĺpec
</p>
</div>
<div class="patamala"></div>
<div id="patavelka">
<p>paticka
</p>
</div>
</body>
</html>


A CSS:

/* CSS Document */
body
{
font-family: Arial CE, Arial;
margin: 0;
padding: 0;
text-align: center;
background-color: #aaaaaa;
}

#telo
{
margin: 0 auto;
width: 870px;
background-color: #ffffff;

}

#hlavicka
{
width: 870px;
background-color: #cccccc;
}

#navigacia {
width: 870px;
}


#divvelky
{
width: 870px;
}

#divmaly
{
width: 730px;
float: left;


}
#divprostredny
{
width: 552px;
float: right;
background-color: #fafafa;
}

#lavystlpec
{
width: 178px;
float: left;
background-color: #ffcc00;
}

#pravystlpec
{
width: 140px;
float: right;
background-color: #ffcc00;
}

.patamala
{
clear: both;
width: 605px;
}

#patavelka
{
clear: both;
width: 870px;
background-color: #cccccc;
}
habendorf
Profil
pe1: Nejen že to je celkem spatlanina, ale především nevyhovuje zadání. Přečti si ho ještě jednou.
maxel
Profil *
http://www.dynamicdrive.com/style/layouts/category/C10/
Toto téma je uzamčeno. Odpověď nelze zaslat.

0