Это практическое руководство проиллюстрирует метод управления интервалами и отступами в адаптивном дизайне.
Как управлять интервалами и отступами в адаптивном дизайне?
Отступами и интервалами в адаптивном дизайне можно управлять с помощью CSS. Практическая демонстрация управления интервалами и заполнением приведена ниже.
Шаг 1. Создайте структуру HTML
Сначала создайте структуру HTML и текст внутри нее, используя и <дел> теги:
< тело >
< ч2 > Адаптивное CSS-заполнение и интервалы < / ч2 >
< div > Этот элемент CSS имеет отступы 80 пикселей и интервал 40 пикселей. < / div >
< / тело >
Шаг 2. Примените CSS
Теперь давайте применим CSS к <дел> ярлык. Сначала установите « прокладка ” стоимость недвижимости до “ 80 пикселей », чтобы освободить пространство вокруг элемента. Далее установите « допуск ” стоимость недвижимости до “ 40 пикселей » и создайте пространство вокруг элементов за пределами границы. Наконец, используйте « граница » и укажите границу и цвет для создания границы:
div {прокладка : 80 пикселей ;
допуск : 40 пикселей ;
граница : 1 пиксель твердый зеленый ;
}
Вышеприведенный вывод подтверждает, что интервалы и отступы были применены.
Давайте проверим, отзывчив он или нет, сжав окно браузера:
При сжатии окна содержимое ведёт себя отзывчиво, что подтверждает, что применяемые отступы и интервалы являются отзывчивыми.
Заключение
Для управления интервалами и отступами в адаптивном дизайне существуют свойства CSS. Чтобы добавить отступы в адаптивный дизайн, используя « прокладка ' свойство. Аналогично, интервал можно добавить в адаптивный дизайн с помощью « допуск ' свойство. Эта статья представила пользователям решение для управления интервалами и отступами в адаптивных проектах.