Как вычисляется padding, если он указан в процентах? Очень просто:
При указании
paddingв процентах, значение считается от ширины родителя элемента.
Даже внутренний отступ сверху и снизу вычисляется именно исходя из ширины родителя. Поэтому реализовать адаптивный квадрат на CSS очень просто.
.square {
display: block; width: 50%;
}
.square:after {
content: '';
display: block;
padding-top: 100%;
}
По порядку:
- создаем блок, который хотим сделать квадратным
- помещаем внутрь элемент (
:after) - делаем элемент блочным
- задаем элементу
padding-top: 100%
Псевдоэлемент используется, чтобы не создавать лишний html элемент.
А как поместить контент?
Все сломается, если поместить в блок .square контент, например, текст. Наш квадрат превратится в…
Знание основных концепций ООП является фундаментом, позволяющим переходить к изучению более высокоуровневых принципов проектирования. Рассмотрим некоторые основные понятия ООП: абстракция, инкапсуляция, полиморфизм и наследование.
Абстракция
Определение в логике. Абстракция (лат. abstractio — отвлечение) — теоретическое обобщение как результат абстрагирования. Абстрагирование — отвлечение в процессе познания от несущественных сторон, свойств, связей объекта (предмета или явления) с целью выделения их существенных, закономерных признаков.
Таким образом абстракцией можно считать набор существенных признаков объекта.
Википедия про абстракцию в ООП. Абстракция в ООП — это придание объекту характеристик, которые чётко определяют его концептуальные границы, отличая от всех других объектов. Фундаментальная идея состоит в разделении несущественных деталей…
