#Вопросы
###Какие бывают значения display? Расскажите как ведёт себя каждое свойство.
display: block;
— Блочная модель, занимает всю ширину родителя, отступы.
display: inline-block;
— Без указания ширины имеют ширину контента, выстраиваются друг за другом слева направо, есть оступ равный ширине пробела.
display: inline;
— Без указания ширины имеют ширину контента, выстраиваются друг за другом слева направо, отступы сверху и снизу не работают.
display: table;
— Как таблица <table>
.
display: table-row;
— Строка таблицы <tr>
.
display: none;
— Элемент удалятся и место не резирвируется, будто его и не было.
display: inline-table;
— Встраивается как таблица <table>
, но я вляется строчным элементом и обтекается другими строчными элементами, например текстом(есть маргины).
display: flex;
— Элемент ведет себя как блочный и выкладывает содержимое согласно флекс-модели.
display: inline-flex;
— Элемент ведет себя как блочный и выкладывает содержимое согласно флекс-модели.
display: inline-flex;
— Элемент ведет себя как блочный и выкладывает содержимое согласно флекс-модели.
display: list-item;
— Элемент ведет себя как блочный и добавляется как макер списка.
display: run-in;
— Элемент ведет себя как блочный или строчный, в зависимости от контекста.
display: table-caption
— Элемент ведет себя как заголовок таблицы <caption>
.
display: table-cell;
— Элемент ведет себя как ячейка таблицы <td>
или <th>
.
display: table-column;
— Элемент ведет себя как колонка таблицы <col>
.
display: table-column-group;
— Определяет, что элемент является группой одной или более колонок таблицы, как при использовании <colgroup>
.
display: table-footer-group;
— ведет себя как <tfoot>
.
display: table-header-group;
— ведет себя как <thead>
.
display: table-row-group;
— ведет себя как <tbody>
.
###Что вы знаете о весе селекторов? Каковы значения веса?
###Какие бывают значения у свойства position? Расскажите как ведёт себя каждое свойство. ###Что будет если задать элементу с position:relative свойство top:10px left: 10px? Что будет если тоже самое задать элементу с position: static? ###Что такое float? ###Что такое clearfix? Из чего он состоит и для чего он? ###Как верстать html письма? ###Из чего строится размер элемента? ###Что такое border-box? ###Расскажите о различия padding и margin? ###Как ведут себя margin у двух элементов по соседству? ###Какие теги по умолчанию являются блочными, а какие строчными? Можно ли изменить их поведение и как? ###Есть ли у тегов предопределённые стили? ###Как повлиять на вертикальное выравнивание строчного элемента? ###Как браузер “читает” css? ###Какие свойства браузеру отрисовать тяжелее всего? ###При изменении каких свойств браузер затратит больше всего ресурсов и почему? ###Какие вы знаете псевдоэлементы? Где их используют? ###Что такое инлайновые стили? ###Инлайновые стили “сильнее” стилей в обычном файле css? ###Что такое наследование стилей? ###Что вы знаете об !important? ###Приходилось ли Вам сталкиваться с фоном в письмах? Расскажите о своём опыте. ###Как отцентровать элемент по горизонтали не зная ширину родительского блока? ###Как отцентровать элемент по вертикали не зная высоту родительского блока? Перечислите все известные вам методы. ###Что такое “резиновая” вёрстка? ###Какие вы знаете значения размеров в “резиновой” вёрстке? ###Какие бывают значения у свойства background-size? Расскажите о каждом из них. ###Что такое семантичная вёрстка? Для чего она? Улучшает ли она что либо? ###Чем отличается article от section? ###Какие вы знаете способы организации css кода? ###Что такое БЭМ? ###По БЭМ может ли быть блок внутри блока? ###Какие из препроцессоров вы знаете? В чём их различия? ###Какие из инструментов сборки вам знакомы? ###Что лучше Gulp или Grunt? ###Как происходит “сборка” проекта в Gulp и Grunt? ###Что лучше Less или Scss? ###Вы знакомы с Google Pagespeed? ###Что такое gracefull degradation? ###Как проверить html-код на валидность? ###Что такое Bootstrap? Из чего состоит его сетка? На чём построен Bootstrap? ###Что такое размер viewport? ###Вертикальный скролл входит в размер viewport? ###Какой размер вертикального скролла? ###Как правильно задать overflow для body чтобы сохранить вертикальный скролл? ###Как сделать мобильную, планшетную и десктопную версию сайта? ###Что такое ретинизация? ###Должны ли мы отдавать разные размеры картинок пользователям разных устройств? Если да, то как? ###Как можно задавать размеры картинкам? ###Что такое SVG? ###Что такое иконочные шрифты? Где их искать и как подключать? ###Что лучше, делать иконки через SVG или через иконочные шрифты? ###Какие вы знаете способы подключения шрифтов к странице? ###Какие есть способы вставки SVG в HTML? В чём между ними разница? ###Как мы можем взаимодействовать с SVG? ###Как проверить кроссбраузерность тех или иных методов вёрстки? ###Что такое JQuery? ###Как найти элемент на странице с помощью JS и JQuery? ###Что вы знаете о замыканиях и областях видимости в JS? ###Чем ограничена область видимости JS? ###Чем ограничена область видимости Document? ###Что такое DOM? ###Что подразумевает понятие MVC? ###Что такое AJAX? ###Как вызвать отладчик в разных браузерах? ###Расскажите что показывает каждая вкладка в отладчике? ###Что такое NODE JS? ###Что такое Bower? ###Что такое npm? ###Расскажите про формат .json? ###Зачем нам обычно файл package.json? ###Что такое git? ###Что такое ветки(branches)? ###Как посмотреть все ветки в вашем проекте? ###Как посмотреть текущее состояние ветки? ###Что такое отслеживание в git? ###Что такое commit? ###Знакомо ли вам git flow? Если да, то расскажите что это такое? ###Вы знакомы с работой в командной строке? ###Какой командой посмотреть список папок и файлов в категории? ###Какой командой мы можем создать и удалить папку в директории? ##Тесты ###Эти тесты были даны прямо на собеседованиях. Решать нужно было с помощью карандаша и листка бумаги. ###Сверстайте горизонтальный слайдер. Обычная галерея из трёх картинок. Одна картинка занимает размер всего блока. Картинки меняются по нажатию. Реализуйте с помощью JQuery и(или) CSS. ###Реализуйте мобильное меню “гамбургер”. При нажатии на кнопку всплывает полное меню. Реализуйте с помощью JQuery и(или)CSS. ###Дано три блока [1][2][3]. Нужно: ###сделать блоки вертикально ###поменять блоки местами [3][2][1], [3][1][2] ###сделать блоки горизонтально без расстояния между блоками ###Решите без помощи flex. ###Напишите стандартный AJAX запрос на получение информации из формы. Можно не точь-в-точь, на память. ###Что выведет код: var a=1; function num() { var a; console.log(a); a = 3; } num();