Свойство CSS background-position задает начальное положение фонового изображения. По умолчанию - в левом верхнем углу.

У этого свойства два значения: положение по горизонтали (может быть - left, center, right) и вертикали (может быть - top, center, bottom).

Кроме использования ключевых слов положение также можно задавать в процентах, пикселах или других единицах.

Если применяются ключевые слова, то порядок их следования не имеет значения, при процентной записи вначале задается положение рисунка по горизонтали, а затем, через пробел, положение по вертикали.


Made in HTML/CSS

Свойство CSS background-repeat определяет, как будет повторяться фоновое изображение. Можно установить повторение рисунка только по горизонтали, по вертикали или в обе стороны.

Возможные значения:

no-repeat - Одно фоновое изображение в элементе без его повторений, положение которого определяется атрибутом background-position.
repeat - Фоновое изображение повторяется по горизонтали и вертикали.
repeat-x - Фоновый рисунок повторяется только по горизонтали.
repeat-y - Фоновый рисунок повторяется только по вертикали.



Made in HTML/CSS

Свойство CSS background-size определяет ширину и высоту фонового изображения.

Возможные значения:

значение - Ширина и высота фонового изображения в прямом виде.
проценты - Ширина и высота фонового изображения в процентном отношении от ширины и высоты элемента.
contain - Изображение масштабируется, сохраняя пропорции, по большей стороне так, чтобы картинка целиком поместилась внутрь блока.
cover - Изображение масштабируется, сохраняя пропорции, по меньшей стороне так, чтобы его ширина или высота равнялась ширине или высоте блока.
auto - Если задано для ширины и высоты (auto auto), то размеры фонового изображения остаются исходными (по умолчанию); если только для одной стороны (100px auto), то размер вычисляется автоматически исходя из пропорций изображения.



Made in HTML/CSS

Свойство CSS background является сокращением, которое объединяет несколько отдельных свойств, связанных с фоновым оформлением элемента.

Оно позволяет одновременно задавать цвет фона, изображение, положение, размер и поведение (повторение) фонового изображения.

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

Made in HTML/CSS

Поля и отступы

Свойство CSS margin используется для установки внешних отступов вокруг элементов.
Оно позволяет создать пространство между границами элемента и окружающими его элементами.

В отличие от внутреннего отступа (padding), который добавляет пространство внутри элемента, margin определяет пространство снаружи.



Made in HTML/CSS

Свойство CSS padding используется для задания внутреннего отступа элемента, то есть пространства между содержимым элемента (текстом, изображениями и т. д.) и его границами.

padding помогает обеспечить лучшую читаемость и визуальную отделенность содержимого от фона.



Made in HTML/CSS

Свойство CSS scroll-margin-top используется для задания отступа при прокрутке элемента, который будет применяться, когда элемент выделяется при помощи якорной ссылки (например, при переходе по ссылке, указывающей на определенное место на странице).

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



Made in HTML/CSS

Раздел: Рамки (границы)

Свойство CSS border-color используется для задания цвета границы элемента.

Оно позволяет контролировать цвета границ сверху, справа, снизу и слева, а также задавать цвет границы для всех сторон одновременно.



Made in HTML/CSS

Свойства CSS border-bottom-color, border-left-color, border-right-color и border-top-color предоставляют возможность задания цвета для отдельных сторон границы элемента.

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

Made in HTML/CSS

Свойство CSS border-style используется для задания стиля границ элемента.

Оно позволяет управлять внешним видом границ, определяя, как они будут отображаться.

Стиль границы влияет на визуальное оформление и восприятие элементов на странице.

Made in HTML/CSS

Свойства CSS border-bottom-style, border-left-style, border-right-style и border-top-style позволяют задавать стиль границы для каждой стороны элемента отдельно.

Это дает возможность более точно контролировать визуальное оформление границ, создавая уникальные дизайны.



Made in HTML/CSS

Свойство CSS border-width используется для задания ширины границ элемента.

Оно применимо ко всем сторонам границы и позволяет контролировать, насколько толстыми будут границы вокруг элемента.

Это свойство может быть задано для всех сторон одновременно или индивидуально для каждой.



Made in HTML/CSS

Свойство CSS border является сокращенной записью для установки границ элемента.

Оно объединяет три свойства: border-width, border-style и border-color.

Это позволяет задавать все три характеристики границы в одной строке, упрощая процесс стилизации.

Made in HTML/CSS

Свойство CSS border-radius используется для задания радиуса закругления углов элемента.

Это позволяет создавать элементы с округлыми краями, что придаёт им более мягкий и современный вид.

Свойство может применяться ко всем углам одновременно или индивидуально к каждому углу.



Made in HTML/CSS

Свойство CSS border-image-source показывает источник изображения.

Это может быть URL изображения или значение none, чтобы удалить границу.



Made in HTML/CSS

Свойство CSS border-image-slice:
- Определяет, как изображение будет разделено на части. Это значение может быть указано в пикселях, процентах или значении fill.



Made in HTML/CSS

Свойство CSS border-image-width:
- Определяет ширину границы, используя одно или несколько значений



Made in HTML/CSS

Свойство CSS border-image-outset:
- Указывает расстояние, на которое изображение границы будет выступать за элемент, используя одно или несколько значений.



Made in HTML/CSS