www.wmaster.ru
Wmaster.ru

На главную

Введение в дизайн

СТАТЬИ

Хостинг

DOCS

Коллекция шрифтов

Скрипты

Секреты мастеров

Продвижение сайта

Soft

Журнал Wmaster

Электронные журналы

ФоруМ

web-mastering
HTML
Programming
HTML-редакторы
Учебник по SEO
Apache
MySQL
XML/WML
Flash
Photoshop
.htaccess
Всё для форумов
Clipart
3DSMax
SSI
CSS
Технология раскрутки
Авторское право
Кодовые таблицы
Важное

Windows

Macromedia Dreamweaver MX

12.3. Macromedia DreamWeaver MX. Каскадные таблицы стилей.Часть3

Далее я загружу вновь созданную страницу в редактор и на панели CSS Style выберу пункт New CSS Style (Рис. 12.02). Если у вас не отображается панель CSS Style, тогда поставьте флажок в пункте Windows - CSS Style главного окна редактора. В открывшемся меню (Рис. 12.13)

 

Рис. 12.13

нужно задать имя, выбрать размещение во внешнем файле и нажать кнопку ОК (на скриншоте я заполнил все требуемые поля). После нажатия кнопки ОК появится диалоговое окно где нужно задать имя для сохраняемого файла (Рис. 12.14)

Рис. 12.14

Имя можете задать свое, далее кнопка "Сохранить" и откроется окно CSS Style Definition (пункты которого мы так долго обсуждали)  Рис. 12.15

Рис. 12.15

Для примера я задам только размер букв и шрифт (см. скриншот), - далее кнопка ОК и щелчок мышкой по имени стилевого класса (cssrth77demo на скриншоте) и стиль будет применен. Теперь осталось "перекрасить" гиперссылки, - для этого кликните правой кнопкой мышки по панели  CSS Style, но теперь, вместо пункта Make Custom Style Class, выберите пункт  Use CSS Selector, где в выпадающем списке Selector (Рис. 12.16)

Рис. 12.16

имеются четыре пункта, о них по порядку:

 a:link - стиль применить ко всем гиперссылкам,
 
a:visited - стиль применить ко всем посещенным гиперссылкам,
 
a:hover - стиль применить к гиперссылке при наведении на нее курсора мышки,
 
a:active - стиль применить ко всем активным гиперссылкам.

Предположим я хочу назначить гиперссылкам зеленый цвет, посещенным - золотистый, а активным - красный. Для этого в списке
Selector я выбираю пункт a:link, в поле Define In я указываю - style_rth77_demo.css (внешний CSS файл, тот, в котором уже имеется запись о форматировании текста) и открывшемся окне (Рис. 12.17)

Рис. 12.17

в пункте Color, остается только выбрать цвет (правда я выбрал не совсем зеленый, а скорей салатовый, но сути дела это не меняет) и нажать кнопку ОК. Окно закроется, далее снова щелчок мышью по имени стилевого класса (cssrth77demo Рис. 12.15) и ссылки "перекрасятся" в зеленый (читай салатовый) цвет. Теперь для посещенных ссылок, тут все по аналогии -  в списке Selector я выбираю пункт a:visited, в поле Define In я указываю - style_rth77_demo.css (внешний CSS файл, тот, в котором уже имеется запись о форматировании текста и о том что гиперссылки должны быть зелеными) и открывшемся окне (Рис. 12.18)

Рис. 12.18

в пункте Color выбирается цвет для посещенных гиперссылок. По окончании - кнопка ОК. Ну и для активных ссылок все тоже самое, в пункте Selector нужно выбрать пункт a:active, в поле Define In указать - style_rth77_demo.css (внешний CSS файл, тот, в котором уже имеется запись о форматировании текста и о том, что все гиперссылки должны быть зелеными, а посещенные золотистыми) и открывшемся окне (Рис. 12.19)

Рис. 12.19

в пункте Color выбрать красный цвет. Завершающий аккорд - кнопка ОК. Теперь текст отформатирован, ссылки перекрашены и можно вешать этот файл на любые страницы (как "повесить" CSS файл на страницу говорилось в самом начале этой части).

Для редактирования данных в CSS файлах следует перейти на вкладку Edit Styles панели CSS Styles (Рис. 12.20)

Рис. 12.20

где вы сможете это сделать. Для примера, если вы хотите снова изменить цвет всех гиперссылок, то двойной щелчок мышью по пункту a:link (Рис. 12.20) снова откроет окно для редактирования этого параметра (то которое на рисунке 12.17).

Пример с использованием CSS (каскадные таблицы стилей)

Для удаления CSS со страницы, на панели CSS Style (Рис. 12.21)

Рис. 12.21

щелчок правой кнопкой мыши по имени стилевого класса и выбрать в контекстном меню пункт Delete.

 

<< назад    оглавление    вперед >>

Партнеры Wmaster
Protoplex.RU
Эскизы татуировок
Поиск по сайту
Объявления
Twitter автора
Карта сайта
Наши баннеры
О проекте

Реклама
(понижение цен)

Об Авторе
Команда
Архив рассылки
 Запомнить эту страницу
Сделать стартовой
Рассылка
Wmaster.ru - всё для вебмастера.
Наша кнопка

Все желающие могут поставить нашу кнопочку к себе на сайт
Всё для веб-мастеров

Партнеры
Бочкарёв Антон
Mail: webmaster[at]wmaster.ru
ICQ: 148780826
Хостинг от Valuehost
© RUscripts.design 2003

© Wmaster Design Group 2001-2008. © Все права защищены. При перепечатке любого материала с сайта  ссылка на http://www.wmaster.ru/  обязательна.