33. Опишите структуру листов css (правила, селекторы, блоки объявлений, свойства).

Главный строительный блок CSS — это правила. Можно сказать, что сама таблица стилей состоит из набора правил.Каждое правило имеет две основные части: селектор (selector) и блок объявлений (declaration block). Селектор определяет, к чему будут применяться стили, блок объявлений — какие стили применяем. Блок объявлений состоит из одного или нескольких объявлений (declarations), а каждое объявление — это сочетание свойства (property) и егозначения (value).

Составление CSS правил:

• Первым указывается селектор (к чему применяем стили). Допускается указывать несколько селекторов через запятую.

• Далее идет блок объявлений в фигурных скобках (собственно список применяющихся стилей).

• Отдельные объявления внутри блока объявлений разделяются точкой с запятой. После последнего объявления в каждом правиле точку с запятой можно не ставить.

• Каждое объявление представляет собой имя CSS свойства и его желаемое значение, разделенные двоеточием.

34. Перечислите и охарактеризуйте типы селекторов правил CSS.

• Тег —  div{color:red}

• id - #back{color:red}. Т.е. когда в селекторах стоит решетка #, а за ней какое-то слово, значит мы ищем элемент с таким атрибутом id, и для него применяем правило. Значение атрибута id всегда уникальное. Лучше его применять в отдельных областях (шапка сайта, левая колонка, футер), т.е. создаем здесь элементы с уникальным атрибутом id.

• Класс - .blue{color:blue}. Т.е. когда элементы в разных частях страницы имеют одинаковое оформление. Значение атрибута не уникальное, т.е. его можно применять у разных элементов. Можно применять пробелы, чтобы отделять друг от друга разные классы. Атрибут «класс» лучше использовать при описании элементов, которые могут повторяться в разных областях.

• Атрибуты - [title]{background:#ffc;}. И так можно задавать правила для любого атрибута. В атрибутах можно указывать и точное значение (см. пример ниже) и правило для него. При этом учитывается регистр слов.

• Псевдоклассы. «Псевдо» — потому что в коде никаких классов нет. Это состояние вашего элемента, которое формируется в результате построения вашего документа (т.е. можно описывать элементы в зависимости от их месторасположения в документе) или от состояния, которое получается в результате ваших действий (например, навели мышкой на элемент, у него появился псевдокласс, увели мышку с элемента, всевдокласс исчез).

• Псевдоэлементы. Это область, которой в реальности нет, она возникает только  в момент построения данного элемента. Это области в наших элементах, которых специально в коде не выделяли. Например, есть параграф, и никаких дополнительных элементов внутри нет. А нам надо выделить первую строчку в нем. Для этого используют псевдоэлементы.

35. Назовите и охарактеризуйте способы включения правил CSS в страницы HTML. .

1. В разделе HEAD веб-страницы может быть указан адрес от-

дельного файла (или нескольких файлов), содержащего правила CSS, с помощью тега LINK:

<link type="text/css" rel="Stylesheet" href="stylesheet.css"/>

2. Правила CSS могут быть размещены непосредственно в тексте веб-страницы в разделе HEAD в парном теге style:

<style type="text/css"> ...

</style>

3. Блок объявлений без фигурных скобок может быть помещен

непосредственно в значение атрибута style любого тега HTML.

36. Каким образом можно разместить на странице фоновый рисунок?

Можно ли разместить фоновый рисунок для отдельного элемента HTML?

<style type="text/css">

BODY {

background: url(images/target.gif) no-repeat 30px 20px; /* Параметры фона */

}

</style>

37. В чем различие между тегами <div> и <span>?

1)  <span> – работает со строчными элементами <b>, <i> и т.п.  <div> – работает с блочными элементами <p>, <ul> и т.п. 2)  <div> выделяет для себя отдельную строку в отличие от <span>.

38. Что такое псевдоклассы CSS?

Псевдоклассы - это особые свойства, которые позволяют менять стиль элемента в зависимости от действий пользователя, а так же положения этого элемента (тега) в общем потоке документа, что позволяет разбавить дизайн страницы некой динамикой и логикой. Классическим примером применения псевдоклассов является ссылка, которая меняет свой цвет при наведении на неё курсором.

Вот список всех псевдоклассов:

• hover - Стиль элемента на который наведён курсор мыши.

• active - Стиль для ссылки которая становится активной, но переход по ней еще не совершен.

• visited - Стиль для недавно посещённой ссылки.

• link - Стиль для нечасто посещаемой ссылки.

• focus - Стиль элемента находящегося в фокусе.

• first-child - Стиль первого дочернего элемента.

• lang - Определяет язык, который используется в фрагменте документа.

О каждом псевдоклассе мы отдельно поговорим ниже, а сейчас пару слов о синтаксисе.

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

a:hover { color:#ff0000} a - элемент (селектор), а проще тег к которому мы решили применить псевдокласс в нашем случае это ссылка. :hover - после двоеточия собственно нужный нам псевдокласс. {color:#ff0000} - ну и блок объявления стилей в фигурных скобках.

39. Каким образом можно добавить комментарии в CSS-документ?

/* Это комментарий CSS1 */

40. Изобразите механизм применения правил CSS в виде блоксхемы.

41. Охарактеризуйте архитектуру сайтов со статическими веб-страницами. Сатические Web-сайты — требуют от разработческой фирмы или иных профессионалов по работе с html, Javascript и другими Web-технолгиями знания и умения работать с программными разработческими продуктами, а также оборудования, необходимого для их создания и постоянной поддержки. Проще говоря, Вам потребуется профессионал не только для того, чтоб создать Ваш Web-сайт, но и постоянно обновлять его. Статический сайт полезен для тех компаний, которым необходимо лишь несколько статических Web-страниц простого содержания. Такие сайты не нуждаются во встроенном модуле электронной коммерции.