Оформление ссылок и форм в CSS

18 просмотров Время на прочтение: 2 минут(ы)

Пример 1

Значение “block” свойства “display” отображает ссылки как блочные элементы – занимающие отдельные строки. Свойство “width” задаёт ссылкам ширину в 100 пикселов. Значение “none” свойства “text-decoration” убирает подчёркивание у ссылок. Свойство “border” задаёт зелёную рамку у ссылок, а “padding” задаёт отступ в 10 пикселов между текстом и рамкой. Также у ссылок по умолчанию указывается красный фон и синий текст.

Псевдокласс “hover”, который указывается с двоеточием после “a”, описывает свойства ссылки при наведении на неё указателя мыши – синий фон и красный текст. Псевдокласс “active” описывает свойства ссылки при нажатии на неё – чёрный фон и белый текст.

Пример 2

Свойство “margin” для формы выводит её по центру. “border” для формы создаёт ей двойную рамку. Для элементов “div”, которые заключают в себя текстовые поля и кнопку, свойство “margin” устанавливает отступ от их границ до внешних объектов. Класс “myinput” устанавливает для текстовых полей одинаковую ширину. Псевдокласс “focus” задаёт голубой фон и красную рамку полей при редактировании и кнопки при нажатии.

РубрикиCSS

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *

©2024 Шигорин Сергей Владимирович
Мы используем cookie-файлы для наилучшего представления нашего сайта. Продолжая использовать этот сайт, вы соглашаетесь с использованием cookie-файлов.
Принять
Top.Mail.Ru
Каталог сайтов Всего.ру
Белый каталог сайтов PopCat.ru