Vytvářejte opakující se oblasti a tabulky a upravujte konfiguraci vlastností tabulky v aplikaci Dreamweaver s cílem řídit rozložení stránky.
Opakující se oblast je část šablony, kterou lze na stránce založené na šabloně mnohokrát duplikovat. Opakující se oblasti se obvykle používají s tabulkami, ale můžete definovat opakující se oblast i pro jiné prvky stránky.
Opakující se oblasti umožňují kontrolovat rozložení stránky opakováním určitých položek, například rozložení položky katalogu a popis, nebo řádek pro data, jako je seznam položek.
Existují dva typy šablonových objektů pro opakující se oblasti, které můžete použít: opakující se oblast a opakující se tabulka.
Vytvořit opakující se oblast v šabloně
Opakující se oblasti umožňují uživatelům šablon duplikovat určenou oblast v šabloně tak často, jak je potřeba. Opakovaná oblast není nutně upravitelná oblast.
Chcete-li vytvořit editovatelný obsah v opakující se oblasti (například umožnit uživateli zadat text do buňky tabulky v dokumentu založeném na šabloně), musíte vložit editovatelnou oblast do opakující se oblasti.
Vyberte text nebo obsah, který chcete nastavit jako opakující se oblast.
Umístěte kurzor do dokumentu na místo, kam chcete vložit opakující se oblast.
Vyberte možnost Vložit > Předloha > Opakovaná oblast.
V kategorii Předlohy na panelu Vložit vyberte možnost Opakovaná oblast.
Pro pojmenování oblasti nepoužívejte speciální znaky.
Vložení opakované tabulky
Opakující se tabulku můžete použít k vytvoření editovatelné oblasti (ve formátu tabulky) s opakujícími se řádky. Můžete definovat atributy tabulky a nastavit, které buňky tabulky jsou editovatelné.
Vyberte možnost Vložit > Předloha > Opakovaná tabulka.
V kategorii Předlohy na panelu Vložit vyberte možnost Opakovaná tabulka.
Řádky
Určuje počet řádků, který má tabulka.
Sloupce
Určuje počet sloupců, který má tabulka.
Odsazení buňky
Určuje počet pixelů mezi obsahem buňky a hranicemi buňky.
Mezery buněk
Určuje počet obrazových bodů mezi sousedními buňkami tabulky.
Pokud výslovně neurčíte hodnoty pro odsazení buňky a mezery buněk, většina webových prohlížečů zobrazí tabulku tak, jakoby odsazení buňky bylo nastaveno na hodnotu 1 a mezery buněk nastavené na hodnotu 2. Pokud chcete, aby webové prohlížeče zobrazovaly tabulku bez odsazení a mezer, nastavte Odsazení buňky a Mezery buněk na 0.
Šířka
Specifikuje šířku tabulky v pixelech nebo jako procento šířky okna prohlížeče.
Okraj
Určuje šířku okraje tabulky v obrazových bodech.
Pokud výslovně nestanovíte hodnotu pro okraj, většina webových prohlížečů zobrazí tabulku tak, jako by byl okraj nastavený na hodnotu 1. Pokud chcete, aby webové prohlížeče zobrazovaly tabulku bez okraje, nastavte hodnotu Okraj na 0.
Chcete-li vidět okraje buněk a tabulky, když je okraj nastavený na hodnotu 0, vyberte možnost Zobrazit > Možnosti zobrazení návrhu > Vizuální pomůcky. Tato možnost je k dispozici pouze v zobrazení návrhu.
Opakovat řádky tabulky
Určete, které řádky v tabulce jsou zahrnuty v opakující se oblasti.
Počáteční řádek
Nastaví zadané číslo řádku jako první řádek k zahrnutí do opakující se oblasti.
Koncový řádek
Nastaví zadané číslo řádku jako poslední řádek k zahrnutí do opakující se oblasti.
Název oblasti
Umožňuje nastavit jedinečný název pro opakovanou oblast.
Nastavení střídání barev pozadí v opakující se tabulce
Poté, co vložíte opakující se tabulku do šablony, můžete ji přizpůsobit střídáním barvy pozadí řádků tabulky.
<tr bgcolor="@@( _index & 1 ? '#FFFFFF' : '#CCCCCC' )@@">
Můžete nahradit hexadecimální hodnoty #FFFFFF a #CCCCCC jinými barevnými volbami.
Následuje příklad kódu tabulky, která obsahuje střídající se barvy pozadí řádků tabulky:
<table width="75%" border="1" cellspacing="0" cellpadding="0">
<tr><th>Name</th><th>Phone Number</th><th>Email Address</th></tr>
<!-- TemplateBeginRepeat name="contacts" -->
<tr bgcolor="@@(_index & 1 ? '#FFFFFF' : '#CCCCCC')@@">
<td> <!-- TemplateBeginEditable name="name" --> name <!-- TemplateEndEditable -->
</td>
<td> <!-- TemplateBeginEditable name="phone" --> phone <!-- TemplateEndEditable -->
</td>
<td> <!-- TemplateBeginEditable name="email" --> email <!-- TemplateEndEditable -->
</td>
</tr>
<!-- TemplateEndRepeat -->
</table>
Další podobné
Tvorba nádherných webů v aplikaci Dreamweaver
Vytvářejte, kódujte a spravujte dynamické weby pomocí výkonného všestranného nástroje.