Jak definovat styly pomocí nástroje pro výběr tagů v aplikaci Dreamweaver

V aplikaci Dreamweaver můžete vytvořit zcela nové styly pomocí selektorů volání nebo ID, ale můžete také vytvořit styly, které změní formátování existujících tagů HTML. Tyto styly se vytvářejí pomocí selektoru značek, který je také známý jako selektor prvků . Když definujete styl pomocí selektoru tagů, můžete změnit vzhled, pozici a další funkce jakékoli existující značky HTML.

Mnoho značek HTML již obsahuje možnosti formátování. Například značky nadpisů zahrnují formátování textu pomocí velkého tučného písma. Když vytváříte styl pomocí selektoru tagu, musíte vzít v úvahu možnosti formátování, které jsou již s tímto tagem spojeny. Jakékoli možnosti, které definujete, budou buď přidány do stávajícího formátování, nebo přepíší formátování.

Můžete se zeptat: „Proč bych předefinoval

místo vytvoření nového stylu nadpisu pomocí selektoru třídy nebo ID?“ Ačkoli můžete definovat nový styl třídy namísto předefinování značky HTML, někdy je lepší použít existující značku HTML.

Styly nadpisů jsou na webu obzvláště důležité, protože text je formátován v an

tag je dobře rozpoznán jako nejdůležitější text na stránce. Mimo jiné text ve formátu an

značka může získat zvláštní pozornost od vyhledávačů.

Chcete-li vytvořit styl, který předefinuje značku HTML (např

tag) pomocí selektoru tagů nejprve vytvořte soubor nebo otevřete existující a poté postupujte takto:

1 V panelu Selektory panelu CSS Designer vyberte šablonu stylů, do které chcete přidat nový styl.

Když vytvoříte styl pro existující značku HTML, nemusíte použít samotný styl jako u stylů tříd a ID. Kdekoli jste použili značku HTML, použijí se nastavení definice stylu.

2Pokud chcete styl zacílit na konkrétní typ média nebo velikost obrazovky, vyberte nebo definujte dotaz na média v panelu @Media.

Použití dotazů na média se styly je volitelné. Pokud nezadáte dotaz na média, Dreamweaver použije vlastnost Global a váš styl bude fungovat ve všech formátech médií a velikostech obrazovky.

3 Klepněte na znaménko plus (+) na panelu Výběr.

Do panelu Selektory je přidán nový selektor.

Když kliknete na znaménko plus (+), abyste vytvořili nový selektor, může se stát několik věcí v závislosti na tom, co je již na stránce otevřené v Dreamweaveru. Když poprvé vytvoříte styl na prázdné webové stránce, Dreamweaver zadá tělo do panelu Výběry.

Pokud pracujete na stránce s textem nebo jiným obsahem, který je formátován pomocí značek nebo stylů HTML, Dreamweaver může přidat složený selektor na základě prvků obklopujících vše, co jste vybrali pomocí kurzoru.

4 V panelu Selektory poklepejte na název selektoru. Začněte zadávat název značky HTML a poté značku vyberte z rozevíracího seznamu, který se zobrazí.

Pomocí selektoru značek můžete zadat název libovolné značky HTML a vytvořit styl. Při psaní značky HTML se zobrazí rozevírací seznam se značkami, které začínají stejným písmenem, které jste zadali. Je dobré vybrat požadovaný štítek ze seznamu, než zadávat celý název štítku sami, protože se vyhnete překlepům.

5Na panelu Vlastnosti zadejte požadovaná nastavení v pravidle stylu.

Písmo a barva se okamžitě použijí na text na stránce formátované pomocí

štítek.

Pokud chcete mít možnost používat stejnou značku HTML s různým formátováním v různých částech stejné stránky, můžete vytvořit složené styly. Složené styly jsou užitečné, například pokud chcete text formátovaný pomocí

aby vypadala jinak v hlavní části stránky než na postranním panelu.