Html+css

Медіа запити дозволяють

• Змінити мову сторінки залежно від вподобань користувача
• Застосувати різні стилі для відображення сторінки на екрані та друку на принтері
• Застосовувати CSS правила залежно від ширини області відображення
• Отримати дані про конфігурацію комп’ютера користувача, наприклад, модель монітора та процесора

Під час розробки, для перевірки вигляду сторінки на мобільних пристроях зручно

• Використовувати смартфон, підключений через USB
• Використовувати кілька різних пристроїв, підключених через bluetooth
• Використовувати симулятор пристроїв у консолі розробника браузера

Як правило, для коректної роботи медіа-запитів на мобільних пристроях

• Їхні параметри експерементально підбирають для різних моделей телефонів і плашетів
• В медіа-запит додають перелік моделей, яких він стосується
• В сторінку додають мета-параметр viewport з відповідними атрибутами
• В тег html додають атрибут mobile зі значенням true

Тег

варто використовувати, щоб:

• Виділити важливу частину речення жирним та більшим шрифтом;
• Задати підзаголовок сторінки;
• Цей тег підходить для обох варіантів використання.

Щоб оформити інформацію у вигляді списку без нумерації використовують:

• Тег ol;
• Тег ul;
• Тег p;
• Жоден з цих тегів.

Щоб додати зображення на сторінку можна використати:

• тег img з атрибутом href;
• тег photo з атрибутом href;
• тег photo з атрибутом src;
• тег img з атрибутом src;
• варіанти c та d.

Щоб браузер відкривав сторінку за посиланням в новій вкладці (або вікні), використовують:

• тег target;
• атрибут target;
• тег new;
• атрибут blank.

На сервері www.site.com, в папці web, знаходиться файл сторінки index.html. Сторінка відкривається за посиланням http://www.site.com/web/index.html. Поряд з файлом сторінки є папка images, в якій лежить файл зображення logo.jpg. Які варіанти підключення зображення в файл сторінки є коректними?

• < img src=”logo.jpg” >;
• < img src=”images/logo.jpg” >;
• < img src=”/images/logo.png” >;
• < img src=”www.site.com/images/logo.png” >;
• < img src=”http://www.site.com/web/images/logo.jpg” >.

Відносне посилання НЕ включає:

• Протокол;
• Хост;
• Шлях;
• Протокол та хост;
• Хост та шлях.

Якщо ми хочемо змінити вигляд елемента, наприклад, вказати колір тексту чи розмір шрифту, краще використати:

• Відповідні CSS властивості, наприклад, color;
• Спеціально призначені для цього теги, наприклад, font;
• Можна використати обидва варіанти.