Iframe используется для отображения веб-страницы внутри веб-страницы.
Атрибут src определяет URL (адрес) внутренней веб-страницы. Также можно задать ширину и высоту окна со страницей атрибутами width и height.
- чекбоксы
- radio-кнопки
- submit-кнопки и др.
При позиционировании элементов они могут перекрывать друг друга. Свойство z-index определяет, какой элемент должен быть расположен спереди, а какой - сзади.
В некоторых случаях можно использовать свойство прозрачности opacity <1, чтобы добиться тех же результатов.
Свойство overflow отвечает за отображение контента, выходящего за пределы своего контейнера.
Это свойство определяет область элемента, которая должна быть показана. Вырезаемая область определяется или URL, относящимся к SVG, или формой, например, circle().
http://bennettfeely.com/clippy/
Альтернативный способ вырезать область - использовать mask, но так же не поддерживается IE, Edge and Opera mini (http://caniuse.com/#search=mask)
Псевдоклассы определяют динамическое состояние элементов, которое изменяется с помощью действий пользователя, а также положение в дереве документа. Определяются единичным двоеточием (:)
@-правило - это инструкция CSS. Каждая инструкция начинается с @ и содержит одно из ключевых слов.
Данное правило позволяет загружать на веб-страницу специальные шрифты. Правило указывает браузеру скачать шрифт из указанного источника и затем отобразить его, как определено в CSS.
Это правило обычно указывается в начале файла и указывает на включение внешнего CSS-файла. При этом содержимое внешнего файла вставляется на строку, где указано правило.
Это правило содержит условия для определения стилей для разных экранов. Условия могут содержать размеры экранов, что очень полезно для адаптивной верстки.
@media not|only mediatype and (media feature) {
CSS-Code;
}
all
print
screen
speech
используется для всех девайсов
для принтеров
для смартфонов, мониторов компьютера и т.д.
для смартфонов, мониторов компьютера и т.д.
aspect-ratio
max-height
max-width
orientation
Соотношение между шириной и высотой области просмотра
Максимальная высота области отображения, например, окна браузера
Максимальная ширина области отображения, например, окна браузера
Ориентация окна просмотра (альбомный или портретный режим)
Обязательные пункты
Дополнительно – поддержка ретины, отсутствие багов при увеличенном шрифте и др.
3. Создайте адаптивную разметку в двух вариантах:
tablet
desktop
https://webref.ru/layout/advanced-html-css/responsive-web-designелекторы и производительность