Autor Zpráva
Janina
Profil *
Ahoj, mám web dělaný přes rámy, ale teď je chci trochu předělat a protože jsou doporučovanější tabulky, tak bych to chtěla zkusit. Pročetla jsem si i CSS a chtěla to udělat pozicováním, ale furt nechápu jak. Když to podle návodu nějak napíšu, tak mi tam stejně žádný tabulky jako rámy nevyplivne. Ráda bych aby to ve výsledku vypadalo nějak jako vje uvedenoe složitějších příkladech ( http://www.jakpsatweb.cz/tabulky-design.html ).
krteczek
Profil *
nevím jak vypadá tvuj web,(myslim jeho rozložení, ale tady ti dam základní rozložení vebu pomocí divů a css:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html>
<head>
<title>Název stránky</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1250">
<link rel="stylesheet" href="styl.css" >
</head>
<body>
<div id="vsechno">

<div class="hlavicka">
<h1>Nějaky obrázek,nadpis, cokoliv</h1>
</div>
<div class="clanky">
<!--Tady si napiš co chceš ,je to vlastní obsah webu-->
</div>
<div class="navigace">
<!--zde je menu-->
<p><a href="index.php">Úvodní strana</a></p>
<p><a href="index.php?clanek=login">Přihlásit se</a></p>
<p><a href="index.php?clanek=registrace">Zaregistrovat se</a></p>
</div>
<div class="paticka">
<!--tady si dej kdo to dělal-->
<p>vytvořil &copy;krteczek 2005</p>
</div>
</div>
</body>

</html>

tak takhle nějak vypadá zdroják stránky vytvorený pomocí divu a css
tady ti jeste musím napsat aspon zaklad css souboru "styl.css" aby se ti ty divy zobrazily jak maji:


body{text-align:center;}

#vsechno{margin: 0 auto;width:750px;border:1px solid black;}

.hlavicka{width:750px;height:80px;border:1px solid black;}

.navigace{width:150px;border:1px solid black;float:right}

.clanky{width:580px;border:1px solid black;float:left;margin-left:5px;}

.paticka{width:750px;margin:0;border:1px solid black;clear:both;}


snad to pomůže nejen tobě...
a na tabulky zapomeň, ja jsem začal dělat css layout, potom sem objevil tabukovy layout naučil se ho pracně pochopil jak funguje a zavrhl jsem ho . vrátil jsem se zpět k css protože je to jednodužší na psaní kodu, tabulky ted používám jen výjmečně ( na formuláře ) a to jen v tomhle zápisu:

<table><!-- začátek tabulky -->
<tr><!-- tohle je řádek tabulky -->
<td><!-- tohle je sloupec tabulky -->
nějaký obsah
</td>
<td><!-- další sloupec -->
další obsah
</td>
</tr>
<tr> <- další řádek tabulky -->
.
.
</tr>
</table>

klidně můžeš použít identifikaci tabulky

<table id="tabulka1">

newbo identifikaci buňky tabulky


<tr class="řadek2">
<td class="sloupec_treti">

rozdíl mezi "id=" a "class=" :
id je jedinečné, vrámci jedné stránky může být použito jen jednou, tzn že<div id="hlavicka">
ta "hlavicka" může být jen jedna na stránce
pouzit ji vícekrat je špatně!!!:

<!--tohle je špatný příklad uvedený zde jen proto, abyste pochopili co se nesmí udělat!!!-->
<div id="hlavicka>
<table id="hlavicka">
<a id="hlavicka" href="neco.nekde">neco</a>
<!-- takhle by vám to nejspíš nefungovalo, a pokud náhodou jo, tak by kod te stránky nebyl validní!!! -->

teď jsem se dostal ke<tag class="neco">: tohle je identifikátor ktery můžete použít několikrát na téže stránce, a vše bude v pořádku:


<div class="hlavicka>
<table class="hlavicka">
<a class="hlavicka" href="neco.nekde">neco</a>

tyhle identifikátory slouží k tomu, abysme v css mohli konkrétním prvkům přiřadit jejich vlastnosti.
snad jsem to podal dost jednoduše na pochopení...:o)
krteczek
krteczek
Profil *
ještě jedna a duležitá informace!!!:
když použijete identifikátor <div id="neco"> tak ho v css voláte takhle: #neco {vlastnosti;
když použijete <div class="neco_jineho"> tak ho v css voláte takhle: .neco_jineho {vlastnosti;}

to je snad už všechno... :o)
krteczek
Hugo
Profil
krteczek

Jenom poznamka - neni vhodne v CSS pouzivat podtrzitka (_). Nektere prohlizece s tim maji problemy.
krteczek
Profil *
hugo:
díky, já je normálně nepoužívám tady jsem to použil jen demonstračně protože mne jiny vhodny název v tom momentu nenepadl.
krteczek
Janina
Profil *
Ty jo, fakt výborný, díky!
Toto téma je uzamčeno. Odpověď nelze zaslat.