Оформлення посилань в css


Оформлення посилань в css

Оформлення посилань в CSS. Основи CSS для початківців. урок №11

За допомогою CSS ви зможете оформити не тільки колір посилання, але прибрати підкреслення або замість підкреслення додати пунктирну лінію, а також зможете зробити і анімовану посилання.

Колір посилання в CSS

Властивість «COLOR»
Щоб замінити колір посилання скористайтеся властивістю «color» для селектора «a».

Псевдокласи для посилань

Хочу познайомити вас з псевдоклас для посилань.
Псевдокласи - це класи, які визначають динамічний стан елементів і змінюються за допомогою дій користувача.

Властивості (імена псевдокласів):

Тепер приклад.
Пропоную для прикладу показати стандартні посилання. які були додані через HTML без оформлення CSS.

Тепер змінимо оформлення посилань через CSS.

Додайте ось це посилання в HTML код:

Тепер ось цей код в CSS:

Властивість «TEXT-DECORATION»
Щоб прибрати підкреслення у посилання, скористайтеся властивістю «text-decoration» зі значенням «none».

Зараз я зроблю так, що при наведенні на посилання, підкреслення зникне.

Розмір посилання

Можна ще додати до заслання плавне збільшення (анімація):

Пунктирне підкреслення у посилання

Властивість «BORDER-BOTTOM»
Щоб зробити у посилання пунктирне підкреслення при наведенні, то спочатку потрібно прибрати підкреслення, а замість підкреслення прописати правило «border-bottom»:

От і все!
Чекаю вас на наступних уроках!

Схожі статті