Расскажите о стилизации SVG

Стилизация SVG отличается от стилизации HTML. SVG основан на XML и стилевые свойства отличаются по названию. Fill вместо background-color, stroke вместо border и т.д.

Изображение в формате SVG можно стилизовать в SVG-разметке, а также в CSS файлах. Если вы используете SVG-спрайты, то стилизовать svg можно только в разметке. Также не получится динамически изменить свойства SVG js-ом.

#вопросы_по_css

Что такое прогрессивный рендеринг?

При первом рендеринге загружается только содержимое первого экрана, а последующая загрузка выполняется по мере того, как пользователь скользит или проходит время. Преимущество этого: повышение производительности веб-страницы, отсутствие траты ресурсов, загрузка по запросу.

#вопросы_по_html

Что такое распространение события (Event Propagation)?

Когда какое-либо событие происходит в элементе DOM, оно на самом деле происходит не только в нем. Событие «распространяется» от объекта Window до вызвавшего его элемента (event.target). При этом событие последовательно пронизывает (затрагивает) всех предков целевого элемента. Распространение события имеет три стадии или фазы:

1. Фаза погружения (захвата, перехвата) — событие возникает в объекте Window и опускается до цели события через всех ее предков.
2. Целевая фаза — это когда событие достигает целевого элемента.
3. Фаза всплытия — событие поднимается от event.target, последовательно проходит через всех его предков и достигает объекта Window.

#вопросы_по_javascript

Объясните, как браузер определяет, на какие элементы накладывать CSS стили?

Браузер сравнивает селекторы справа налево. Браузер находит все элементы DOM, соответствующие ключевому (самому правому) селектору. Дальше проходит до его родителя и ищет соответствия. Чем короче цепь селекторов, тем быстрее браузер найдет элемент.

#вопросы_по_css

Перечислите все виды списков, которые можно использовать для создания веб-страниц

В HTML есть 3 вида списков:
- Упорядоченный список: отображает элементы в пронумерованном формате. В тег обозначает упорядоченный список
- Неупорядоченный список: отображает элементы в маркированном формате. В тег обозначает неупорядоченный список
- Список определений: отображает элементы в форме определения, подобной словарю. В , а также теги обозначают список определений.

#вопросы_по_html

Объясните, почему это не является IIFE: function foo(){ }();

В этом примере будет выведено исключение SyntaxError, в данном случае это объявление функции и скобки в конце не будут отнесены к функции, так как они играют роль оператора группировки. Такие скобки не могут быть пустыми, поэтому будет выброшено исключение. Для того чтобы переделать этот пример под немедленно вызываемую функцию - нужно обернуть функциональное выражение в скобки и удалить именование функции.

#вопросы_по_javascript

Какие вы знаете методы запрета обтекания (clearing) и в каких случаях они применяются?

Clear устанавливает, с какой стороны элемента запрещено его обтекание другими элементами. Если задано обтекание элемента с помощью свойства float, то clear отменяет его действие для указанных сторон.

Значения:
none - отменяет действие свойства clear, при этом обтекание элемента происходит, как задано с помощью свойства float или других настроек.
both - отменяет обтекание элемента одновременно с правого и левого края. Это значение рекомендуется устанавливать, когда требуется снять обтекание элемента, но неизвестно точно, с какой стороны.
left - отменяет обтекание с левого края элемента. При этом все другие элементы на этой стороне будут опущены вниз, и располагаться под текущим элементом.
right - отменяет обтекание с правой стороны элемента.
inherit - устанавливает значение родителя.

#вопросы_по_css

Что такое элемент холста в HTML5?

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

#вопросы_по_html

Что такое замыкание и как/для чего его используют?

Если одна функция определена внутри другой, то внутренняя имеет доступ к ОВ внешней. Это называется замыканием (а также "лексической ОВ" или "статическая".
При выполнении функции используется та область видимости переменных, которая существовала на момент объявления этой функции. Это лексическая область видимости.

#вопросы_по_javascript

В чём разница между строчным и блочно-строчным элементом?

block
- Начинается с новой строки родительского элемента и занимает всю строку.
- Можно задавать ширину и высоту.
- Можно выровнять с помощью vertical-align.
- Margins и paddings работают со всех сторон.

inline-block
- Размер зависит от контента.
- Можно задавать ширину и высоту.
- Можно выровнять с помощью vertical-align.
- Margins и paddings работают со всех сторон.

inline
- Размер зависит от контента.
- Ширину и высоту задавать нельзя.
- Можно выровнять только по горизонтали. Место, которое занимает элемент по вертикали, зависит от line-height.
- Ведёт себя как блочный элемент, если задать вертикальные margins и paddings.

#вопросы_по_css

Перечислите все виды списков, которые можно использовать для создания веб-страниц

В HTML есть 3 вида списков:
- Упорядоченный список: отображает элементы в пронумерованном формате. В тег обозначает упорядоченный список
- Неупорядоченный список: отображает элементы в маркированном формате. В тег обозначает неупорядоченный список
- Список определений: отображает элементы в форме определения, подобной словарю. В , а также теги обозначают список определений.

#вопросы_по_html

В чем разница между .call и .apply?

Сходство заключается в том, что и .call, и .apply используются для вызова функций, а также первый параметр будет использоваться как значение this внутри функции. А разница в том, что .call в качестве слудующих аргументов принимает аргументы, разделенные запятыми, в то время как .apply в качестве следующих аргументов принимает массив аргументов.

function add(a, b) {
return a + b;
}
console.log(add.call(null, 1, 2)); // 3
console.log(add.apply(null, [1, 2])); // 3

#вопросы_по_javascript

На что нужно обратить внимание при написании эффективного CSS?

Для написания эффективного CSS должна быть система. БЭМ, RSCSS, OOCSS - кому что больше подходит. Самая популярная методология - БЭМ. У каждого элемента уникальный класс, все элементы имеют одинаковую специфичность. Код можно переиспользовать.

#вопросы_по_css

Специфичность CSS-селекторов

- тег и псевдоэлемент имеют специфичность 0001
- класс, псевдокласс, атрибут - 0010
- id имеет специфичность 0100
- инлайновый стиль имеет приоритет 1000

#вопросы_по_css

Какую функцию выполняет тег figure в HTML5?

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

#вопросы_по_html

Объясните, почему это не является IIFE: function foo(){ }();

В этом примере будет выведено исключение SyntaxError, в данном случае это объявление функции и скобки в конце не будут отнесены к функции, так как они играют роль оператора группировки. Такие скобки не могут быть пустыми, поэтому будет выброшено исключение. Для того чтобы переделать этот пример под немедленно вызываемую функцию - нужно обернуть функциональное выражение в скобки и удалить именование функции.

#вопросы_по_javascript

В чем разница между «сбросом» и «нормализацией» CSS? Что бы вы выбрали и почему?

Сброс (reset) сбрасывает все стили элементов.
Normalize приводит стили к единому виду во всех браузерах.
Лучше выбирать Normalize из-за кроссбраузерности.

#вопросы_по_css

Расскажите про тег DIV?

DIV - это контейнер или область, которая обычно используется для размещения элемента или группы элементов. DIV в основном используется для выделения области или блока текста на веб-странице TML, чтобы можно было применить к ним стили. Тег DIV также является альтернативой тегу Paragraph p, поскольку он создает логическое разделение документа HTML.

#вопросы_по_html

Дайте определение функции высшего порядка.

Функция высшего порядка — это любая функция, которая принимает одну или несколько функций в качестве аргументов, которые она использует для работы с данными, и/или возвращает функцию в качестве результата. Классическим примером является метод map, который принимает массив и функцию в качестве аргументов. Затем map использует эту функцию для преобразования каждого элемента в массиве, возвращая новый массив с преобразованными данными. Другими популярными примерами в JS являются forEach, filter и reduce.

#вопросы_по_javascript

Какие новые псевдоклассы добавлены в CSS3?

(1) elem: nth-child (n) выбирает n-й дочерний элемент под родительским элементом, и метка этого дочернего элемента - elem, n может принимать определенные значения или функции.
(2) elem: nth-last-child (n) выполняет ту же функцию, что и выше, но выполняет поиск сзади.
(3) elem: last-child выбирает последний дочерний элемент.
(4) elem: only-child Если elem является единственным дочерним элементом родительского элемента, выберите его.
(5) elem: nth-of-type (n) Выберите элемент n-го типа под родительским элементом. N может принимать определенные значения или функции.
(6) elem: first-of-type выбирает первый элемент типа elem под родительским элементом.
(7) elem: last-of-type выбирает последний элемент типа elem под родительским элементом.

#вопросы_по_css

Что такое кэш приложения в HTML5?

Одной из наиболее востребованных функций для конечного пользователя является работа в автономном режиме. Другими словами, если соединение с интернетом недоступно, страница должна возвращаться из кэша браузера, и кэш приложения поможет вам в этом.

Кэш приложения помогает вам определить, какие файлы должны быть кэшированы, а какие нет.

#вопросы_по_html