1. Как вы понимаете термины «логическая разметка» и «физическая разметка»?
Логическая разметка — это использование тегов для определения структуры и семантики контента, например, заголовков, абзацев, списков, ссылок. Логическая разметка помогает определить смысл элементов на странице, без учета их внешнего вида. Физическая разметка — это использование тегов для задания конкретного оформления, например, жирного текста, курсива и т.д. Она больше фокусируется на визуальном представлении данных.
2. Почему считается более грамотным выносить оформление веб-страниц в отдельный файл?
Оформление веб-страниц в отдельный файл (например, в CSS) является более грамотным решением, потому что это облегчает поддержку и повторное использование стилей, а также улучшает структуру кода. Это позволяет менять внешний вид всей страницы или сайта, изменяя только один файл, а не каждый элемент на отдельных страницах.
3. Назовите тэги логической и физической разметки языка HTML. Какие из них рекомендуется использовать? Почему?
Теги логической разметки: <h1>, <p>, <ul>, <ol>, <a>. Эти теги определяют структуру контента. Рекомендуется использовать их, так как они помогают поисковым системам и пользователям понимать структуру страницы. Теги физической разметки: <b>, <i>, <u>, <font>. Они управляют только визуальным оформлением. Однако рекомендуется использовать стили CSS вместо этих тегов, так как они лучше разделяют структуру и внешний вид.
4. В чём различие тэгов <strong> и <b>? В каких случаях используется каждый из них?
Тег <strong> используется для выделения текста с акцентом на его важность, а <b> — для визуального выделения текста, без привязки к его важности. Например, <strong>Важно!</strong> говорит, что текст важен, а <b>Жирный</b> просто делает текст жирным, без указания на его важность.
5. Какой тэг используется для оформления текстов программ?
Для оформления текстов программ используется тег <pre>. Он сохраняет пробелы и переносы строк, а также позволяет отображать текст в моноширинном шрифте.
6. Какое расширение обычно имеют стилевые файлы? В каких программах их можно редактировать?
Стилевые файлы обычно имеют расширение .css. Их можно редактировать в текстовых редакторах, таких как Sublime Text, Visual Studio Code, Notepad++, а также в специализированных редакторах CSS.
7. Как подключить стилевой файл к веб-странице?
Стилевой файл подключается к веб-странице с помощью тега <link>, который вставляется в секцию <head>. Пример подключения: <link rel="stylesheet" type="text/css" href="styles.css">
8. Как изменить оформление стандартных тэгов, например <h1>?
Чтобы изменить оформление стандартных тегов, например, <h1>, можно использовать CSS, например: h1 { font-size: 24px; color: blue; }
9. Назовите три способа определения цвета элемента на веб-странице.
Именованный цвет (например, color: red;) Шестнадцатеричный код (например, color: #FF5733;) RGB код (например, color: rgb(255, 87, 51);)
10. Зачем используют классы?
Классы используются для группировки элементов с одинаковым стилем или поведением. Это позволяет применять одинаковые стили ко многим элементам, не повторяя их описания, и дает возможность легко изменять стили для определённых групп элементов.
11. Чем отличается класс от псевдокласса? Какие псевдоклассы вы знаете?
Класс — это атрибут, который позволяет группе элементов на веб-странице применять одинаковые стили. Класс используется в CSS с точкой перед его названием, например, .myClass. Псевдокласс — это специальное состояние элемента, которое используется для применения стилей в определенных случаях, например, когда элемент находится в фокусе или при наведении мыши. Примеры псевдоклассов: :hover, :focus, :nth-child, :first-child, :last-child.
12. Чем различаются два определения?
p.qq {color:white;}
.qq {color:white;}
В первом случае (p.qq {color:white;}) стиль применяется ко всем элементам <p>, у которых есть класс qq. Во втором случае (.qq {color:white;}) стиль применяется ко всем элементам, у которых есть класс qq, независимо от того, какой тег они используют.
13. Зачем нужен тэг <span>?
Тег <span> используется для выделения части текста или элемента внутри других тегов без создания нового блока. Это строчный элемент, который не влияет на структуру документа, но позволяет применить к выделенному тексту стили или скрипты.
14. Что такое наследование свойств в CSS? Чем, по вашему мнению, оно полезно?
Наследование свойств в CSS означает, что элементы, расположенные внутри других элементов, могут наследовать свойства от своих родительских элементов. Это упрощает стиль и позволяет избегать повторения кода. Например, если родительский элемент имеет шрифт font-family: Arial;, то все дочерние элементы наследуют этот шрифт, если им явно не заданы другие стили.
15. Почему таблицы стилей называют каскадными?
Таблицы стилей называют каскадными из-за принципа, по которому стили применяются. Когда для элемента могут быть применены несколько стилей, браузер определяет, какой из них выбрать, следуя определенному порядку (каскадности). Это позволяет задавать стили на разных уровнях и в разных местах, где каждый последующий стиль может переопределять предыдущий.
16. Что означают определения?
а) р span {font-style: italic;}
б) p.qq span {font-style: italic;}
в) p span.qq {font-style: italic;}
г) p.qq span.zz {font-style: italic;}
д) p span em {color: green;}
а) p span {font-style: italic;} — все элементы <span>, находящиеся внутри <p>, будут отображаться курсивом. б) p.qq span {font-style: italic;} — все элементы <span>, которые находятся внутри элементов <p>, имеющих класс qq, будут отображаться курсивом. в) p span.qq {font-style: italic;} — все элементы <span> с классом qq, находящиеся внутри элементов <p>, будут отображаться курсивом. г) p.qq span.zz {font-style: italic;} — все элементы <span> с классом zz, находящиеся внутри элементов <p> с классом qq, будут отображаться курсивом. д) p span em {color: green;} — все элементы <em>, находящиеся внутри элементов <span>, которые, в свою очередь, находятся внутри элементов <p>, будут зелёного цвета.