Как да дефинирате стилове със селектора на етикети в Dreamweaver

Можете да създавате напълно нови стилове в Dreamweaver с помощта на селектори за повикване или ID, но можете също да създавате стилове, които променят форматирането на съществуващите HTML тагове. Тези стилове се създават с помощта на селектор на етикети, известен също като селектор на елементи . Когато дефинирате стил с помощта на селектора на тагове, можете да промените външния вид, позицията и други характеристики на всеки съществуващ HTML маркер.

Много HTML тагове вече включват опции за форматиране. Например, таговете за заглавия включват форматиране за стилизиране на текст с помощта на голям удебелен шрифт. Когато създавате стил със селектор на маркери, трябва да вземете предвид опциите за форматиране, които вече са свързани с този маркер. Всички опции, които дефинирате, ще бъдат добавени към съществуващото форматиране или ще отменят форматирането.

Може да попитате: „Защо да предефинирам

маркер, вместо просто да създавате нов стил на заглавие с помощта на селектора на клас или идентификатор?" Въпреки че можете да дефинирате нов стил на клас вместо да предефинирате HTML маркер, понякога използването на съществуващ HTML маркер е по-добре.

Стиловете на заглавията са особено важни в мрежата, тъй като текстът е форматиран в an

маркерът е добре разпознат като най-важният текст на страницата. Наред с други неща, текст, форматиран в an

маркерът може да получи специално внимание от търсачките.

За да създадете стил, който предефинира HTML маркер (като например

маркер) със селектора на маркери, първо създайте файл или отворете съществуващ и след това изпълнете следните стъпки:

1В панела Селектори на панела CSS Designer изберете стиловата таблица, към която искате да добавите новия стил.

Когато създавате стил за съществуващ HTML маркер, не е необходимо да прилагате самия стил по начина, по който правите със стиловете за клас и идентификатор. Където и да сте използвали HTML маркера, се прилагат настройките за дефиниране на стил.

2Ако искате да насочите стила към конкретен тип медия или размер на екрана, изберете или дефинирайте медийна заявка в панела @Media.

Използването на медийни заявки със стилове е по избор. Ако не посочите медийна заявка, Dreamweaver ще използва свойството Global и вашият стил ще работи във всички медийни формати и размери на екрана.

3 Щракнете върху знака плюс (+) в панела за избор.

Нов селектор е добавен към панела Селектори.

Когато щракнете върху знака плюс (+), за да създадете нов селектор, могат да се случат няколко неща, в зависимост от това какво вече има на страницата, отворена в Dreamweaver. Първият път, когато създадете стил в празна уеб страница, Dreamweaver въвежда body в панела за избор.

Ако работите върху страница с текст или друго съдържание, което е форматирано с HTML тагове или стилове, Dreamweaver може да добави съставен селектор въз основа на елементите около всичко, което сте избрали с курсора.

4В панела „Селектори“ щракнете двукратно върху името на селектора. Започнете да въвеждате името на HTML маркера и след това изберете маркера от падащия списък, който се показва.

Можете да въведете името на всеки HTML маркер, за да създадете стил, като използвате селектора на етикети. Докато въвеждате HTML маркер, се появява падащ списък с тагове, които започват със същата буква, която сте въвели. Избирането на желания етикет от списъка, вместо да пишете цялото име на маркера сами, е добра практика, защото избягвате правописни грешки.

5В панела Properties задайте желаните настройки във вашето правило за стил.

Шрифтът и цветът се прилагат незабавно към текста на страницата, форматирана с

етикет.

Ако искате да можете да използвате един и същ HTML маркер с различно форматиране в различни части на една и съща страница, можете да създадете комбинирани стилове. Сложните стилове са удобни, например, ако искате текст, форматиран с

таг, за да изглежда различно в основната част на страницата ви, отколкото в страничната лента.