Autor Zpráva
Rufr
Profil *
Nazdar, chtěl bych se vás zeptat co mám udělat pro to aby, když vložím před obrázek text, aby ten text nebyl ani výš ani níž od toho obrázku.Zde je ukázka že je to níž:
www.skokynalyzich.eu/Pokus.html
Děkuji za odpověď
Trejpa
Profil
Rufr:
<img src=obrazek.jpg align=middle>
<img src=obrazek.jpg style=vertical-align:middle>


http://www.jakpsatweb.cz/html/obrazky.html#align
http://www.jakpsatweb.cz/css/vertical-align.html
Rufr
Profil *
Super, nemohl sem to nikde najít..Díky..
Rufr
Profil *
Ale vyskytl se další problém a to s tabulkou.Když se podíváte na ten pokus.html, tak tam mám odkaz novinky.Tam vidíte že kontinentální pohár odskočil o řádek níž..Co s tím?Díky
panther
Profil
Rufr:
Co s tím?
udělat beztabulkový layout, nebo tento přeorganizovat. Doporučuji první variantu, s tabulkovým layoutem budeš mít jen potíže, viz ukázka.
Rufr
Profil *
Ono to nemusí být s tabulku.Jenomže já chci ještě tabulku na pravou stranu.A ta tam musí být, uprostřed je to jedno..
panther
Profil
Rufr:
Ono to nemusí být s tabulku.
tak jí vyhoď a udělej to normálněji.

Jenomže já chci ještě tabulku na pravou stranu.A ta tam musí být
opravdu musí? Budou tam snad tabulková (=křížově na sobě závislá) data? Nemyslím si.
Rufr
Profil *
www.skokynalyzich.eu/snl.bmp
Zde je nákres..
Jak mám udělat ty novinky tak, aby byly přehledné a nebyla tam tabulka?A tam v pravo budou závody živě(tj.že budu psát po jednotlivých závodnících jejich skoky.)
Díky
Trejpa
Profil
Rufr:
Nauč se základy tvorby layoutu. Tabulka se sice na tvorbu layoutu nedoporučuje, ale základní myšlenka s plovoucím layoutem je stejná: obalení významných prvků na stránce do velkých kontejnerů (hlavička, menu, obsah). Tvá snaha mít každou položku menu zvlášť je poněkud zvláštní. (Příklad.)

Třísloupcový layout jsi zkoušel hledat, že?
panther
Profil
Rufr:
Jak mám udělat ty novinky tak, aby byly přehledné a nebyla tam tabulka?
Nebál bych se třeba obyčejného nečíslovaného seznamu (přeci jen je to seznam aktualit).

Přehlednost přece nezáleží na tom, jestli je v HTML kódu tabulka nebo cokoliv jiného (HTML souvisí se sémantikou), na vzhledu (a tedy přehlednosti) se podílí CSS.

že budu psát po jednotlivých závodnících jejich skoky.
zase záleží na stylech, jak to celé ostyluješ. Na tabulku to opravdu není. Pokud nám řekneš, jak bude vpravo to „živé vysílání“ vypadat, co bude všechno obsahovat za informace, dostaneš i přesnější odpověď, jak by celý ten kousek HTML mohl vypadat.

Tabulka se používá tam, kde se jedná opravdu o tabulková data. Ne proto, že se ti nechce cokoliv jiného stylovat.
Rufr
Profil *
Tam v pravo bude napsaný závod.Na ten závod když se klikne zobrazí se nové okno a v tom novém okně budou ti skokani se skoky.
Rufr
Profil *
Ok.Do prostřed klidně nečíslovaný seznam..To se mi líbí, ale co udělat s těmi závody?
panther
Profil
Rufr:
Tam v pravo bude napsaný závod.
jen jméno závodu? To bude obyčejný odkaz, na co potřebuješ tabulku?
Rufr
Profil *
No na to aby se mi to nespojilo s těmi aktualitami...
panther
Profil
Rufr:
Čti pozorně, co ti kdo píše. V [#9] ti psal Trejpa, jak udělat layout bez tabulek, tím vyřešíš i tohle.
Rufr
Profil *
Ještě se tedy zeptám jak mám vložit ten nečíslovaný seznam tak aby mi nelezl do tabulky.Layout mi moc nesedí..Ten mi bude stačit jenom na tu pravou stranu..
Trejpa
Profil
Rufr:
jak mám vložit ten nečíslovaný seznam tak aby mi nelezl do tabulky
Až předěláš layout, tak sedět bude. Bude-li mít seznam kolem sebe obalující blok, roztáhne se pouze na jeho šířku.
panther
Profil
Rufr:
Ještě se tedy zeptám jak mám vložit ten nečíslovaný seznam tak aby mi nelezl do tabulky.
do jaké tabulky, žádnou tam mít nemáš. Začal jsi špatně, být tebou bych začal znovu, dokud je čas a jsi v začátcích se stavbou toho webu. Aby nelezl do tabulky, pokud na tom trváš, dej ho mimo ni :-)

Layout mi moc nesedí
layout je i to, co jsi vytvořil (snažil se vytvořit) ty. Ty máš tabulkový, Trejpa odkazoval ne beztabulkový.

Doplním Trejpu:
Bude-li mít seznam kolem sebe obalující blok, roztáhne se pouze na jeho šířku.
nebo můžeš zadat šířku přímo tomu seznamu, abys web zbytečně nena<dív>al.
Bubák
Profil
Rufr:
Ještě se tedy zeptám jak mám vložit ten nečíslovaný seznam tak aby mi nelezl do tabulky.
Koukám, že nejsem jediný, kdo se nad tím pozastavil.

Layout mi moc nesedí.
Máš na mysli , že ti nesedí beztabulkový layout. Ale jak koukám, tak ti nesedí ani tabulkový layout. Takže neztrácej čas, najdi si nějaký hotový beztabulkový layout, třebas tady: http://blog.html.it/layoutgala/ a ten si doupravíš.
Trejpa
Profil
Rufr:
Tak to zkusím jednodušeji, když už jsi nečetl/nepochopil můj odkaz výše.

Běžný CSS plovoucí layout:
<body style=text-align:center>
  <div style="text-align:left;margin:0 auto;width:960px">
    <div>Tady bude nadpis</div>
    <div style="float:left;width:240px">Tady bude levé menu.</div>
    <div style="float:left;width:480px">Tady bude obsah.</div>
    <div style="float:left;width:240px">Tady bude pravé menu.</div>
    <div style=clear:left>Tady bude patička</div>
  </div>
</body>


Běžný tabulkový layout:
<table align=center width=960>
  <tr><td colspan=3>nadpis
  <tr><td width=240>
    levé menu
  <td width=480>
    obsah
  <td width=240>
    pravé menu
  <tr><td colspan=3>patička
</table>
Rufr
Profil *
Díky..Ale i když hledám, tak nevím kde mám napsat ten kód pro barvu těch jednoztlivých sloupců..
Rufr
Profil *
www.skokynalyzich.eu/n.html
Trejpa
Profil
Rufr:
Že bych tě zase malinko postrčil…

Poznatky:
1) Tabulku s jednou buňkou použitou jen kvůli formátování používat nebudeme. Ostylujeme rovnou obalující blok.
2) Značka <li> patří do seznamu (<ul>, <ol> nebo <menu>).
3) Značka <font> je párová, musíme tedy použít i </font>.
4) Značky umožňují použít více parametrů, <font size="7"><font color="aqua"> lze zkrátit na <font size="7" color="aqua">.
5) Značka style patří do hlavičky. Parametr style se zapisuje jako ostatní parametry ve značce.
6) Poslední blok jsi neměl uzavřený.
7) Pro odsazení bloků od sebe se používá CSS vlastnost margin. Ten seznam však bude lépe vypadat jako seznamy dva.
8) A také by sis mohl upravit skutečnou velikost těch obrázků a zobrazovat je 1:1.

Styly jsem přesunul do hlavičky. Až budeš tvořit i další stránky, tak vše, co je mezi <style> a </style>, ze stránky smaž a dej to do samostatného souboru, řekněme s názvem styly.css. Místo značek <style> bude v hlavičce značka <link rel="stylesheet" href="styly.css" type="text/css">. Styly se tak připojí ke každé stránce a ty je nebudeš muset psát do každé stránky zvlášť.



Tady máš kód pro dosavadní vzhled své stránky. Zkus si ho projít a popřemýšlej, co v něm je a proč.

<html>

<head>
<meta http-equiv="content-type" content="text/html; charset=windows-1250">
<title>Skoky na lyžích</title>

<style>
/* Rozvržení stránky */
body { text-align: center; }
img { vertical-align: middle; }
a img { border: 0; }
a { color: blue; }
a:hover { color: red; }
#stranka { text-align: left; margin: 0 auto; width: 960px; }
h1 { height: 150px; text-align: center; }
#levy, #pravy, #obsah { float: left; width: 240px; }
#obsah { width: 480px; }
#paticka { clear: left; }

/* Vlastní nastavení */
h1 { border: 2px black ridge; padding: 5px; font-size: 250%; }
h1 a { display: block; color: aqua; text-decoration: none; }
#levy a { color: black; }
#pravy { background-color: #d8d8d8; }
</style>

</head>
<body>
  <div id=stranka>
    <h1><a href="/index.htm"><img src=169887.gif align=middle width="313" height="150">
	Skoky na lyžích
	<img src=477922.gif align=middle width="313" height="150"></a></h1>

    <div id=levy>
      <ul>
        <li><a href="/svetovy-pohar.html">Světový pohár</a></li>
        <li><a href="/kontinentalni-pohar.html">Kontinentální pohár</a></li>
        <li><a href="/fis-cup.html">Fis Cup</a></li>
        <li><a href="/grand-prix.html">Grand Prix</a></li>
        <li><a href="/zeny.html">Ženský Kontinentální pohár</a></li>
        <li><a href="/l-kontinentalni-pohar.html">Letní Kontinentální pohár</a></li>
        <li><a href="/l-fis-cup.html">Letní Fis Cup</a></li>
      </ul>
      <ul>
        <li><a href="Skupina-A.html">Skupina A<a></li>
        <li><a href="/Skupina-B.html">Skupina B</a></li>
        <li><a href="/Juniori.html">Junioři</a></li>
        <li><a href="/zavodnice-zeny.html">Ženy</a></li>
        <li><a href="/zavodnici-severska-kombinace.html">Severská kombinace</a></li>
      </ul>
    </div>

    <div id=obsah>
      Tady bude obsah.
    </div>

    <div id=pravy>
      Tady bude pravé menu.
    </div>

    <div id=paticka></div>

  </div>
</body>
</html>

Vaše odpověď


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm:

0