Презентация, доклад на тему Каскадные таблицы стилей

Содержание

1. Каскадные таблицы стилей
2. СодержаниеСпособы связывания документа и таблиц стилей.Идентификатор CSS.Позиционирование.Модульные сетки.Принципы построения модульной сетки.
3. Способы связывания документа и таблиц стилей: 1.Встроенный Пример: Встроенный Пример текста
4. Способы связывания документа и таблиц стилей: 2.Внедрённый
5. Способы связывания документа и таблиц стилей: 3. Связанный Пример:
6. Классы и Идентификаторы css CSS: идентификаторы id.
7. Классы и Идентификаторы css Классы P
8. позиционирование
9. Модульные сеткиБлочная сетка
10. Модульные сетки Колоночная сетка
11. Модульные сеткиМодульная сетка
12. Модульные сеткиИерархическая сетка
13. Принципы построения модульной сетки Одноколонная модульная сетка
14. Принципы построения модульной сетки Двухколонная модульная сетка
15. Трехколонная сетка

СодержаниеСпособы связывания документа и таблиц стилей.Идентификатор CSS.Позиционирование.Модульные сетки.Принципы построения модульной сетки.

Слайд 1Каскадные таблицы стилей

Слайд 2Содержание
Способы связывания документа и таблиц стилей.
Идентификатор CSS.
Позиционирование.
Модульные сетки.
Принципы построения модульной сетки.

СодержаниеСпособы связывания документа и таблиц стилей.Идентификатор CSS.Позиционирование.Модульные сетки.Принципы построения модульной сетки.

Слайд 3Способы связывания документа и таблиц стилей:
1.Встроенный
Пример:

charset="utf-8">
Встроенный

Пример текста

Слайд 4Способы связывания документа и таблиц стилей:
2.Внедрённый
Пример:

Внедрённый

Hello, world!

Слайд 5 Способы связывания документа и таблиц стилей:
3. Связанный
Пример:

Содержимое файла mystyles.css
BODY {
background-color: #000000;
color: #FFFFFF;
}
H1 {
color: #000080;
font-size: 200%;
font-family: Arial, Verdana;
text-align: center;
}
P {
padding-left: 20px;
}

Слайд 6Классы и Идентификаторы css

CSS: идентификаторы id.

#Div {

color: red;
}

Текст первого блока

Текст второго блока

Текст третьего блока

Классы и Идентификаторы css CSS: идентификаторы id. #Div { color: red; } Текст первого блока Текст

Слайд 7Классы и Идентификаторы css

Классы

P
{text-align: justify;

}
P.cite {
color: navy;
margin-left: 20px;
border-left: 1px solid navy;
padding-left: 15px;
}

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

Для исключения засветки экрана дисплея световыми потоками оконные проемы снабжены светорассеивающими шторами
.