Подготовка к собеседованию. html блок

Вопрос-ответ HTML/CSS
1

Тема создана для сбора материалов/мнений на вышеописанную часть собеседований

1 лайк
2

Интересует именно html? Или имеется ввиду верстка в целом (html+css)?
По html, из того, что у меня спрашивали

  1. Что такое DOCTYPE и для чего он нужен
  2. Метатеги, какие бывают, для чего используются
  3. Давали написать код для таблички (рисовали ее со всякими объединениями по горизонтали-вертикали ячеек)
  4. Давали пример кода и просили найти в нем ошибку (например, div вставленный в ul, незакрытые или неправильно закрытые теги)
  5. Варианты подключения цссов-джесов, плюсы-минусы того или иного подключения
  6. Чем отличаются теги i/em и b/strong
  7. Что изменилось в html5 по сравнению с html4 (новые теги/атрибуты, семантика и т.д.)
  8. Чем отличается класс от айди
  9. Чем отличаются div и span
  10. Графика - какой формат лучше использовать в каком случае, чем они отличаются, оптимизация
  11. В чем преимущества (недостатки) блочной верстки перед табличной
  12. Что такое режим совместимости
1 лайк
3

Задача следующая - грядет собес на позицию Front-end junior на которую в требованиях понаписывали вообще дофига чего - там и HTML5/CSS3, Elegant degradation, Javascript, jQuery, php и куча-куча всего. Рискну предположить, что глубоких требований по всему этому беспределу требовать не будут, но хотя бы основы поспрошают. Вот, суть топика и заключается в вычленении этих самых основ, моментов, которые будут спрашивать 100%

4

Требования разные бывают, если затронули PHP и JS ,то я предполагаю, что восновном по ним и будут спрашивать, потому что темы более обширные и основные балы будешь по ответам на вопросы о нихполучать

5
  1. Разница между инлайновыми и блочными элементами. Примеры инлайновых.
  2. Зачем нужны новые теги HTML5, если можно и без них? Что дает семантическая верстка?
  3. Трансформации и анимации в CSS3. Какие есть функции у свойства transform?
  4. Разница между em и %.
  5. Как работают Media Queries?
1 лайк
6

спасибо, я так и ориентируюсь, но данная тема все же про HTML, посему хотелось бы подготовиться и по этому раздему

7
  • Семантика, (когда использовать nav, article и другие новые html5 теги.
  • Блочные, инлайновые, инлайн-блоки, табличные элементы.
  • float и очищение потока
  • Весы селекторов (то, что значит “каскад” из названия “каскадные таблицы стилей”)
1 лайк
8

А этот пукт вообще о чем?

9 
<link rel="stylesheet" href="./css/main.css">
<script src="./js/jquery-2.1.3.min.js"></script>
10

я это понимаю, я просто не в курсе альтернатив такому подключению. Или имеются в виду просто ссылки на плагины и сами минифицированные файлы?

11

Подключить CSS и JavaScript код можно тремя простыми способами:

  1. Inline: Код пишется непосредственно в теге элемента. Для CSS в атрибуте style, а для JavaScript в атрибуте onclick.
  2. Вложенный: CSS и JavaScript код пишутся в блоках <style> и <script> соответственно.
  3. Внешний: Используя тег для CSS файла, или же <script> с указанием атрибута src для JavaScript.

И вот еще:
http://stepbystep.htmlbook.ru/?id=44

2 лайка
12

Нашел в требованиях к одной вакансии пункт

кроссбраузерность, кроссплатформенность (знать основные баги);

сориентируйте, пожалуйста, что надо гуглить, какие проблемы имеются в виду?

13

В последних версиях браузеров проблемы с короссбраузерностью встечаются не так часто. Из того, что попадалось в последнее время - проблемы с line-height (особенно при кастомных шрифтах), в ФФ и вебкитовых браузерах может ехать на пиксель-два. Элементы форм абсолютно не кроссбраузерны, если не обнулять их дефолтные свойства. Вообще многие элементы по умолчанию имеют свойства, которые отличаются в браузерах (размеры шрифтов, марджины и т.д.). Это фиксится цсс-ресетом. Еще сталкивалась с проблемой з-индексов, дропдаун в хроме выпадал под контент хоть ты тресни, а в других браузерах было все ок.
Если брать цсс3, то там могут быть проблемы с совместимостью, например, свойство columns работает в ие с 10-й версии, андроид, по-моему, вообще его не поддерживает.
Если копать глубже, то большие проблемы были с ие6-7 (не знаю, насколько это сейчас актуально, мы ие7 не поддерживаем уже пару лет. про 6й вообще молчу). Ие7, например, не поддерживал инлайн-блоки и табличные свойства, что было большой бедой, если нужно выровнять контент по вертикали. Приходилось юзать экспрешены.
Если говорить про мобильные платформы, то бывают серьезные проблемы при использовании position:fixed. Раньше это свойство не поддерживалось вообще (в иос до 5-й версии, андроид нормально стал поддерживать с 3-й по-моему). Но все-равно и сейчас это может бажить.

4 лайка
14

когда я ваял свой первый вариант резюме на гитхабе, столкнулся с неприятным моментом что Опера вообще не поддерживает вращение объектов

15

На счет оперы, к сожалению, ничего сказать не могу, уже больше двух лет у меня проекты без ее поддержки…

16

@dmitry Можешь, пожалуйста, накидать список вопросов которые могут задаваться в контексте темы jQery?
Заранее спасибо

17
  • Делегирование событий.
  • Работа с Deferred, promise.
  • Работа с анимациями
  • Быстрые, медленные селекторы.
  • Паттерны, антипаттерны работы с jQuery
1 лайк
18

Очень полезная, на мой взгляд, штука http://shichuan.github.io/javascript-patterns/ паттерны

19

Должна поддерживать. А как ты пытался вращать объекты?

20

У меня стоит Opera12.17, пробовал http://daneden.github.io/animate.css/ анимацию “rotateln”