Студопедия — Как применить псевдокласс к ссылкам?
Студопедия Главная Случайная страница Обратная связь

Разделы: Автомобили Астрономия Биология География Дом и сад Другие языки Другое Информатика История Культура Литература Логика Математика Медицина Металлургия Механика Образование Охрана труда Педагогика Политика Право Психология Религия Риторика Социология Спорт Строительство Технология Туризм Физика Философия Финансы Химия Черчение Экология Экономика Электроника

Как применить псевдокласс к ссылкам?






Записываем для начала элемент А, к которому мы будем применять псевдокласс, затем ставим двоеточие и указываем имя псевдокласса, а уже потом в фигурных скобках указываем нужный стиль.

А: ИМЯ ПСЕВДОКЛАССА {...стиль...}

Ну вот для ссылок например бывает четыре псевдокласса:

 

A: link {... стиль оформления обычной ссылки... }
A: active {... стиль оформления ссылки в момент нажатия... }
A: visited {... стиль оформления посещенной ссылки... }
А: hover {... стиль оформления ссылки, на которую наведен указатель мыши... }

 

Ну, теперь давайте я приведу вам некоторые примеры для лучшего понимания. Для начала, посмотрите, как выглядят ссылки по умолчанию:

Видите, только посещенная ссылка отличается от других, а так в принципе все одинаково. Да и цвета не очень. Попробуем создать свой стиль:

a: link {
color: blue;
}
a: visited {
color: gray;
}
a: hover {
color: red;
text-decoration: none;
}
a: active {
color: green;
text-decoration: none;
}

· Смотреть пример ssilki_primer1.htm

В примере выше ссылка ведет сама на себя, и поэтому чтобы увидеть класс уже посещенной ссылки, нужно обновить страницу.

Вообще вариантов оформления ссылки может быть множество, и каждый делает под конкретный дизайн что-то свое. Вот еще примерчик:

a: link {
color: blue;
}
a: visited {
color: gray;
}
a: hover {
color: red
text-decoration: none;
font-weight: bold;
}
a: active {
color: green;
text-decoration: none;
text-transform: uppercase;
}

· Смотреть пример ssilki_primer2.htm

Бывают случаи, когда мы не хотим вообще чтобы ссылка визуально выделялась на фоне текста. Решение опять же в CSS:

a: link {
color: black;
text-decoration: none;
}
a: visited{
color: black;
text-decoration: none;
}
a: hover {
color: black;
text-decoration: none;
}
a: active {
color: black;
text-decoration: none;
}

· Смотреть пример ssilki_primer3.htm

Если для всех псевдоклассов стиль одинаковый, как в примере выше, то это можно записать и короче:

a: link, a: visited, a: hover, a: active {

color: black; text-decoration: none;

}

А можно и вовсе без использования псевдоклассов:

a {

color: black; text-decoration: none;

}

 

Ну вот и все по ссылкам в CSS. Следующий урок будет очень нужным и интересным, там мы рассмотрим очень важный момент, который я советую Вам хорошенько выучить, без него дела не будет:)

 







Дата добавления: 2014-12-06; просмотров: 597. Нарушение авторских прав; Мы поможем в написании вашей работы!



Важнейшие способы обработки и анализа рядов динамики Не во всех случаях эмпирические данные рядов динамики позволяют определить тенденцию изменения явления во времени...

ТЕОРЕТИЧЕСКАЯ МЕХАНИКА Статика является частью теоретической механики, изучающей условия, при ко­торых тело находится под действием заданной системы сил...

Теория усилителей. Схема Основная масса современных аналоговых и аналого-цифровых электронных устройств выполняется на специализированных микросхемах...

Логические цифровые микросхемы Более сложные элементы цифровой схемотехники (триггеры, мультиплексоры, декодеры и т.д.) не имеют...

Уравнение волны. Уравнение плоской гармонической волны. Волновое уравнение. Уравнение сферической волны Уравнением упругой волны называют функцию , которая определяет смещение любой частицы среды с координатами относительно своего положения равновесия в произвольный момент времени t...

Медицинская документация родильного дома Учетные формы родильного дома № 111/у Индивидуальная карта беременной и родильницы № 113/у Обменная карта родильного дома...

Основные разделы работы участкового врача-педиатра Ведущей фигурой в организации внебольничной помощи детям является участковый врач-педиатр детской городской поликлиники...

Деятельность сестер милосердия общин Красного Креста ярко проявилась в период Тритоны – интервалы, в которых содержится три тона. К тритонам относятся увеличенная кварта (ув.4) и уменьшенная квинта (ум.5). Их можно построить на ступенях натурального и гармонического мажора и минора.  ...

Понятие о синдроме нарушения бронхиальной проходимости и его клинические проявления Синдром нарушения бронхиальной проходимости (бронхообструктивный синдром) – это патологическое состояние...

Опухоли яичников в детском и подростковом возрасте Опухоли яичников занимают первое место в структуре опухолей половой системы у девочек и встречаются в возрасте 10 – 16 лет и в период полового созревания...

Studopedia.info - Студопедия - 2014-2024 год . (0.013 сек.) русская версия | украинская версия