Ako definovať štýly pomocou selektora značiek v Dreamweaveri

V Dreamweaveri môžete vytvoriť úplne nové štýly pomocou selektorov volania alebo ID, ale môžete tiež vytvoriť štýly, ktoré zmenia formátovanie existujúcich značiek HTML. Tieto štýly sa vytvárajú pomocou selektora značiek, ktorý je známy aj ako selektor prvkov . Keď definujete štýl pomocou selektora tagov, môžete zmeniť vzhľad, pozíciu a ďalšie funkcie akejkoľvek existujúcej značky HTML.

Mnoho značiek HTML už obsahuje možnosti formátovania. Napríklad značky nadpisov obsahujú formátovanie textu pomocou veľkého tučného písma. Keď vytvárate štýl pomocou selektora tagu, musíte zvážiť možnosti formátovania, ktoré už sú s týmto tagom spojené. Všetky možnosti, ktoré definujete, sa buď pridajú k existujúcemu formátovaniu, alebo prepíšu formátovanie.

Môžete sa opýtať: „Prečo by som mal predefinovať

namiesto vytvorenia nového štýlu nadpisu pomocou selektora triedy alebo ID?“ Aj keď môžete namiesto predefinovania značky HTML definovať nový štýl triedy, niekedy je lepšie použiť existujúcu značku HTML.

Štýly nadpisov sú na webe obzvlášť dôležité, pretože text je vo formáte an

tag je dobre známy ako najdôležitejší text na stránke. Okrem iného, ​​text formátovaný v an

vyhľadávacie nástroje môžu získať špeciálnu pozornosť.

Ak chcete vytvoriť štýl, ktorý predefinuje značku HTML (ako napr

tag) pomocou selektora tagov najprv vytvorte súbor alebo otvorte existujúci súbor a potom postupujte podľa týchto krokov:

1Na paneli Selectors panela CSS Designer vyberte hárok štýlov, do ktorého chcete pridať nový štýl.

Keď vytvoríte štýl pre existujúcu značku HTML, nemusíte použiť samotný štýl tak, ako to robíte so štýlmi triedy a ID. Kdekoľvek ste použili značku HTML, použijú sa nastavenia definície štýlu.

2Ak chcete štýl zacieliť na konkrétny typ média alebo veľkosť obrazovky, vyberte alebo definujte dopyt na médiá na paneli @Media.

Používanie mediálnych dopytov so štýlmi je voliteľné. Ak nezadáte dopyt na médiá, Dreamweaver použije vlastnosť Global a váš štýl bude fungovať vo všetkých formátoch médií a veľkostiach obrazovky.

3 Kliknite na znamienko plus (+) na paneli Výber.

Na panel Výbery sa pridá nový selektor.

Keď kliknete na znamienko plus (+), aby ste vytvorili nový selektor, môže sa stať niekoľko vecí v závislosti od toho, čo je už na otvorenej stránke v Dreamweaveri. Keď prvýkrát vytvoríte štýl na prázdnej webovej stránke, Dreamweaver zadá text na paneli Výber.

Ak pracujete na stránke s textom alebo iným obsahom, ktorý je naformátovaný pomocou značiek alebo štýlov HTML, Dreamweaver môže pridať zložený selektor na základe prvkov obklopujúcich čokoľvek, čo ste vybrali pomocou kurzora.

4 Na paneli Selektory dvakrát kliknite na názov selektora. Začnite zadávať názov značky HTML a potom značku vyberte zo zobrazeného rozbaľovacieho zoznamu.

Môžete zadať názov ľubovoľnej značky HTML a vytvoriť štýl pomocou selektora značky. Počas zadávania značky HTML sa zobrazí rozbaľovací zoznam so značkami, ktoré začínajú rovnakým písmenom, aké ste napísali. Výber požadovanej značky zo zoznamu namiesto zadávania celého názvu značky sami je dobrý postup, pretože sa vyhnete preklepom.

5Na paneli Vlastnosti zadajte požadované nastavenia v pravidle štýlu.

Písmo a farba sa okamžite použijú na text na stránke naformátovanej pomocou

tag.

Ak chcete mať možnosť použiť rovnakú značku HTML s rôznym formátovaním v rôznych častiach tej istej stránky, môžete vytvoriť zložené štýly. Zložené štýly sú užitočné, napríklad ak chcete text formátovaný pomocou

aby vyzerala inak v hlavnej časti stránky ako na bočnom paneli.