kwork banner 468x60kwork banner 728x90kwork banner 930x180skillbox banner 468x60skillbox banner 728x90skillbox banner 930x180flexbe banner 468x60flexbe banner 728x90flexbe banner 930x180

CSS Примеры

Как центрировать выравнивание с абсолютным позиционированием div с помощью CSS

Вы можете выровнять любой элемент <div> с абсолютной или фиксированной позицией по горизонтали по центру, используя CSS-свойство margin в сочетании со свойством left и right. Давайте посмотрим следующий пример, чтобы понять, как это работает:
Подробнее

Как исправить проблему коллапса родительского элемента CSS с дочерними элементами имеющими свойство float

Когда свойство float применяется к элементу внутри не плавающего родительского элемента, родительский элемент не растягивается автоматически для размещения плавающих элементов. Такое поведение обычно называют сворачиванием родителя (collapsing parent). Это не всегда очевидно, если вы не применяете некоторые визуальные свойства, такие как фон или границы, к родительским элементам, но это важно знать и с ними нужно…
Подробнее

Как изменить цвет текста поля ввода с помощью CSS

По умолчанию замещающий текст поля ввода <input> и <textarea> отображается светло-серым цветом, и стандартного CSS-свойства для его стилизации нет. Однако есть некоторые нестандартные псевдоэлементы и псевдоклассы, зависящие от браузера, которые можно использовать для настройки внешнего вида текста-заполнителя, как показано в следующем примере:
Подробнее

Как изменить цвет элемента <hr> с помощью CSS

Вы можете просто использовать CSS-свойство background-color в сочетании с height и border, чтобы изменить цвет по умолчанию для элемента <hr>. В следующем примере мы изменили цвет тега hr на светло-серый. Вы также можете увеличить толщину линии, просто увеличив значение свойства height.
Подробнее

Как расширить поле выбора до ширины по умолчанию при фокусе с помощью CSS

По умолчанию размер элемента <select> зависит от размера самого большого внутреннего элемента <option>. Однако иногда полезно установить фиксированную ширину для поля выбора и увеличить его размер до исходного при фокусе, когда пользователь пытается выбрать какой-либо параметр. В следующем примере показано, как реализовать этот эффект с помощью чистого CSS:
Подробнее

Как изменить цвет выделения текста по умолчанию в браузерах с помощью CSS

По умолчанию большая часть браузера выделяет выделенный текст синим фоном. Однако вы можете переопределить этот параметр с помощью псевдоэлемента CSS ::selection. В настоящее время браузеры поддерживают только небольшое подмножество CSS-свойств для псевдоэлемента ::selection, например color, background-color и text-shadow. Давайте посмотрим на пример: CSS-свойство text-shadow в псевдоэлементе ::selection не поддерживается в Internet Explorer; поддерживается только в…
Подробнее

Как удалить контур вокруг полей ввода текста в Chrome с помощью CSS

В браузере Google Chrome элементы управления формы, такие как <input>, <textarea> и <select>, выделяются синим контуром при фокусе. Это поведение хрома по умолчанию, однако, если оно вам не нравится, вы можете легко удалить его, установив для свойства outline значение none. Давайте посмотрим на следующий пример, чтобы понять, как это работает: Однако рекомендуется применить альтернативный стиль,…
Подробнее

Как убрать интервал между ячейками из таблиц с помощью CSS

По умолчанию между границами соседних ячеек таблицы есть некоторое пространство, поскольку модальные границы по умолчанию для таблиц HTML разделены. Но вы можете перезаписать это свойство и создать таблицу со свернутыми границами без какого-либо интервала между ячейками, просто установив значение CSS-свойства border-collapse для элемента <table> на collapse, как показано в примере ниже:
Подробнее

Как создать вертикальную линию в HTML

Вы можете использовать CSS-свойство border в элементе <span> в сочетании с другими CSS-свойствами, такими как display и height, для создания вертикальных линий в HTML. В следующем примере будет создана вертикальная разделительная линия между двумя изображениями. Вы можете дополнительно увеличить высоту линии, просто увеличив значение свойства height.
Подробнее

Как применить несколько фоновых изображений к элементу с помощью CSS

В CSS3 вы можете добавить или применить несколько фонов к элементу. Фоны размещаются один над другим, причем первый заданный вами фон будет наверху, а последний — сзади. Кроме того, последний фон может включать background-color. Давайте попробуем следующий пример, чтобы понять, как это работает:
Подробнее

Как создать кнопку в HTML-форме, которая будет работать как ссылка

В случае, если у вас нет возможности использовать элемент <a>, вы можете использовать кнопку submit внутри формы <form>, где значение атрибута action установлено на желаемый URL. Давайте попробуем следующий пример, чтобы понять, как это работает: Однако, если вы можете использовать элемент по вашему выбору, вам лучше использовать элемент <a> и стилизовать его, используя CSS-свойства, чтобы…
Подробнее

Как сделать чередующийся фон для строк таблиц с помощью CSS

Вы можете использовать селектор CSS3 :nth-child, чтобы сделать чередование фона для строк таблицы. Визуально это помогает пользователю ориентироваться в таблице. Псевдокласс :nth-child(N) принимает аргумент N, который может быть ключевым словом, числом или числовым выражением в форме xn+y, где x и y — целые числа (например, 1n, 2n, 3n, 2n+1, 3n-2, …). Посмотрим следующий пример, чтобы…
Подробнее