Практическая работа каскадные таблицы стилей css: Лекция на тему «Каскадные таблицы стилей CSS» – Лекция 15. Каскадные таблицы стилей (CSS)

Презентация лабораторной работы «Каскадные таблицы стилей CSS»

Лабораторная работа №7   Определение стилей через классы и идентификаторы

Лабораторная работа №7 Определение стилей через классы и идентификаторы

Пример использования классов при определении стилей В текстовом редакторе Блокнот создайте HTML-документ, в котором с помощью классов создайте три варианта стиля для абзаца P . Для абзацев установите такие параметры как цвет текста, размер шрифта, выравнивание, междустрочный интервал, декорацию текста.

Пример использования классов при определении стилей

В текстовом редакторе Блокнот создайте HTML-документ, в котором с помощью классов создайте три варианта стиля для абзаца P . Для абзацев установите такие параметры как цвет текста, размер шрифта, выравнивание, междустрочный интервал, декорацию текста.

Пример использования классов при определении стилей В текстовом редакторе Блокнот создайте HTML-документ, в котором с помощью классов создайте три варианта стиля для абзаца P . Для абзацев установите такие параметры как цвет текста, размер шрифта, выравнивание, междустрочный интервал, декорацию текста. Листинг HTML-документа   Определение классов  p.class1 {  text-align:center;  color:red;  font-size:50;  line-height:30px;  } p.class2 {  text-align:left;  color:green;  font-size:40;  text-transform:capitalize;  }

Листинг HTML-документа

Определение классов

p.class1 {

text-align:center;

color:red;

font-size:50;

line-height:30px;

}

p.class2 {

text-align:left;

color:green;

font-size:40;

text-transform:capitalize;

}

p.class3 {  text-align:right;  color:blue;  text-decoration:underline;  font-size:30;  line-height:2;  }

p.class3 {

text-align:right;

color:blue;

text-decoration:underline;

font-size:30;

line-height:2;

}

Существует еще два варианта определения стилей: через идентификаторы и классы. Если необходимо для одного и того же тега определить несколько видов начертания символов, нужно использовать классы тегов. Кроме классов стили можно описывать с использованием идентификаторов (#id).

Существует еще два варианта определения стилей: через идентификаторы и классы.

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

Кроме классов стили можно описывать с использованием идентификаторов (#id).

Пример использования идентификаторов при определении стилей  Напишите стилевой файл, в котором с помощью идентификаторов создайте два стиля текста. Для оформления примените следующие параметры: стиль текста, цвет текста, размер шрифта, верхние и нижние отступы. Данный стилевой файл примените в HTML -документе и используйте созданные идентификаторы стилей для абзацев.

Пример использования идентификаторов при определении стилей

Напишите стилевой файл, в котором с помощью идентификаторов создайте два стиля текста. Для оформления примените следующие параметры: стиль текста, цвет текста, размер шрифта, верхние и нижние отступы. Данный стилевой файл примените в HTML -документе и используйте созданные идентификаторы стилей для абзацев.

Пример использования идентификаторов при определении стилей  Напишите стилевой файл, в котором с помощью идентификаторов создайте два стиля текста. Для оформления примените следующие параметры: стиль текста, цвет текста, размер шрифта, верхние и нижние отступы. Данный стилевой файл примените в HTML -документе и используйте созданные идентификаторы стилей для абзацев.
Листинг стилевого файла style.css  #first { Font-size: 30; margin-bottom: 10; margin-top: 20; font-style: italic; color: #808000; } #second{ Font-size: 20; margin-left: 30;margin-top: 25; margin-bottom: 3; color: #000080; }

Листинг стилевого файла style.css

#first {

Font-size: 30; margin-bottom: 10; margin-top: 20; font-style: italic; color: #808000;

}

#second{

Font-size: 20; margin-left: 30;margin-top: 25; margin-bottom: 3; color: #000080;

}

Листинг HTML -документа   Использование идентификаторов    Дата написана одним шрифтом. A событие - другим. Зима. Пpaзднование Нового Года. Лето. Отдыхать! ! !

Листинг HTML -документа

Использование идентификаторов

Дата написана одним шрифтом.

A событие — другим.

Зима.

Пpaзднование Нового Года.

Лето.

Отдыхать! ! !

Свойства текста text-align  - устанавливает выравнивание в блоке текста. text-indent  - определяет отступ первой строки абзаца от левого края блока. line-height  - задание межстрочного расстояния. text-decoration  - определение таких свойств текстового блока, как underline (подчеркивание), overline  (линия над текстом), line-through  (перечеркивание), blink (мерцание). text-transform  - преобразовывает символы текста в соответствии с указанными значениями параметра. Значения: capitalize  - первая буква каждого слова преобразуется в прописную; uppercase  - преобразует все буквы выделенного блока в прописные; lowercase  - преобразует все буквы выделенного блока в строчные.

Свойства текста

text-align — устанавливает выравнивание в блоке текста.

text-indent — определяет отступ первой строки абзаца от левого края блока.

line-height — задание межстрочного расстояния.

text-decoration — определение таких свойств текстового блока, как underline (подчеркивание), overline (линия над текстом), line-through (перечеркивание), blink (мерцание).

text-transform — преобразовывает символы текста в соответствии с указанными значениями параметра. Значения: capitalize — первая буква каждого слова преобразуется в прописную; uppercase — преобразует все буквы выделенного блока в прописные; lowercase — преобразует все буквы выделенного блока в строчные.

Цветовое оформление color  - позволяет задать цвет шрифта.  background-color - устанавливает цвет фона текста.  background-image - параметр, указывающий на рисунок, который необходимо использовать в качестве фона текста. Например: р {background-image: url (http://www.ny. com/image.gif ) }

Цветовое оформление

color позволяет задать цвет шрифта.

background-color — устанавливает цвет фона текста.

background-image — параметр, указывающий на рисунок, который необходимо использовать в качестве фона текста.

Например:

р {background-image: url (http://www.ny. com/image.gif ) }

Цветовое оформление color  - позволяет задать цвет шрифта.  background-color - устанавливает цвет фона текста.  background-image - параметр, указывающий на рисунок, который необходимо использовать в качестве фона текста. Например: р {background-image: url (http://www.ny. com/image.gif ) }
«

Установка полей документа

margin-left – установка левого поля документа

margin-right — установка правого поля документа

Например:

body { margin-left: 10%; margin-right: 10%; }

Создание отступов и интервалов у заголовков и других элементов margin-left – создание левого отступа margin-right - создание правого отступа margin-top - задает верхний отступ margin-bottom – задает нижний отступ

Создание отступов и интервалов у заголовков и других элементов

margin-left – создание левого отступа

margin-right — создание правого отступа

margin-top — задает верхний отступ

margin-bottom – задает нижний отступ

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

Слайд 1

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

Слайд 2

Стиль – набор параметров, задающий внешнее представление объекта. Таблица стилей – это инструмент языка html, предоставляющий возможности по улучшению внешнего отображения страницы средствами структурного программирования. Таблица стилей содержит набор правил (стилей), описывающих оформление самой Web-страницы и отдельных ее фрагментов. Каждый элемент на странице может иметь свой стиль (параграфы, заголовки, линии, текст…). Набор стилей всех элементов называют таблицей стилей .

Слайд 3

Преимущества использования CSS : Разграничение кода и оформления. Разное оформление для разных устройств. Расширенные по сравнению с HTML способы оформления элементов. Уменьшение размеров страниц. Ускорение загрузки сайта. Единое стилевое оформление множества документов. Централизованное хранение

Слайд 4

Уровни CSS : Уровень 1 (CSS1) – принята 17.12.96, Уровень 2 (CSS2) – принята 12.05.98 Уровень 2 (CSS2.1) – принята 07.06.11 Уровень 3 ( CSS3) – разрабатывается

Слайд 5

Правило таблиц CSS состоит из двух частей: селектор { свойство1 : значение ; свойство2 : значение } 1. Селектор – любой тэг html , для которого определение задает каким образом необходимо его форматировать. 2. Определение – состоит из двух частей: свойства значения

Слайд 6

Пример P { color: #0000FF } P — это селектор. Он представляет собой имя тега

. color — это свойство (атрибут) стиля. Он задает цвет текста. #0000FF — это значение атрибута стиля color. Оно представляет код синего цвета, записанный в формате RGB

Слайд 7

Правила CSS 1. Несколько параметров можно перечислять через двоеточие, либо задавать отдельно каждый параметр. 2. Если для одного селектора определяются одинаковые атрибуты, но с разными значениями, то использоваться будет тот, что указан в коде последним. P { color: green } P { color: red } 3. Свойства и их значения в CSS не чувствительны к регистру, поэтому их можно набирать как заглавными, так и строчными символами.

Слайд 8

Способы связывания документа и таблиц стилей: 1. Связывание – позволяет использовать одну таблицу стилей для форматирования многих страниц html. Для этого таблица стилей хранится в отдельном файле с расширением CSS. Присоединяется к документам с помощью тэга , задаваемого в разделе . Пример : HEAD > В связываемом файле содержатся наборы правил CSS, определяющих форматирование документа.

Слайд 9

Содержимое файла mystyles.css BODY {background-color: #000000; color: #FFFFFF} P {color: #0000FF} EM {color: #00FF00; font-weight: bold} .attention {color: #FF0000; font-style: italic} .bigtext {font-size: large}

Слайд 10

2. Внедрение – позволяет задавать все правила таблицы стилей непосредственно в самом документе в стилевом блоке, ограниченном тэгами STYLE : Пример : B {text-transform: uppercase} P {background-color: lightgray; text-align: center} STYLE > HEAD >

Слайд 11

Заголовки title>

Слайд 12

3. Импортирование — позволяет встраивать в документ таблицу стилей, расположенную на сервере. Выполняется это с помощью свойства @import:url(«mystyles.css»).

Слайд 13

4. Встраивание в тэги документа – позволяет изменить форматирование конкретных элементов страницы. Пример:

Слайд 14

Приоритеты CSS (от низшего к высшему), используемые при форматировании: 1. Связанная таблица стилей (по LINK) 2. Импортируемая таблица стилей (@ import ) 3. Правила с элементом html в качестве селектора 4. Правило с параметром CLASS в качестве селектора 5. Правило с параметром ID в качестве селектора 6. Встроенное в тэг html правило

Слайд 15

Связанные , внедренные и импортированные таблицы стилей влияют на форматирование всех элементов документа. Встраивание таблицы стилей в конкретный тэг влияет только на отображение его элементов. Все способы встраивания таблиц стилей свободно могут сочетаться в одном документе. Вложенный элемент наследует правила форматирования элемента-родителя

Слайд 16

Группирование Группирование селекторов h2 { font-family : Verdana } h3 { font-family : Verdana } h2 , h3 { font-family : Verdana } 2. Группирование определений h3 {font-weight: bold} h3 {font-size: 14pt} h3 {font-family: Verdana} h3 ( font-weight : bold ; font -size: 14pt; font-family : Verdana }

Слайд 17

Группирование свойств h3 { font : bold 14pt Verdana } При задании таблицы стилей можно свободно комбинировать все три правила группирования для уменьшения её размеров.

Слайд 18

Наследование Наследованием называется перенос правил форматирования для элементов, находящихся внутри других. Такие элементы являются дочерними, и они наследуют некоторые стилевые свойства своих родителей, внутри которых располагаются.

Слайд 19

Идентификаторы Идентификатор элемента задается при помощи параметра id , в качестве значения которого указывается уникальное имя. На странице можно использовать только один идентификатор с определенным именем, но несколько идентификаторов с разными именами. Т.е. идентификатору соответствует только один элемент на странице. Параметр ID можно применять к любому элементу документа. #Имя идентификатора { свойство1 : значение ; свойство2 : значение ; … }

Слайд 20

Идентификаторы можно применять к конкретному тегу. Тег#Имя идентификатора { свойство1 : значение; свойство2 : значение; … }

Слайд 21

Пример

Обычный абзац p>

Текст параграфа с идентификатором

Слайд 22

Классы Класс позволяет задать разные правила форматирования для одного элемента определённого типа или всех элементов документа. Имя класса указывается в селекторе правила после имени тега и отделяется от него точкой. Можно определить несколько правил форматирования для одного элемента и с помощью параметра class соответствующего тега применять разные правила форматирования. Тег.Имя_класса { свойство1 : значение ; свойство2 : значение ; … }

Слайд 23

Пример h2.red {color: red} h2.blue {color:red; background-color: blue} STYLE >

Красный шрифт h2> Красный шрифт на синем фоне h2>

Слайд 24

Если класс должен применяться ко всем элементам документа, то в селекторе задаётся имя класса с лидирующей точкой без указания конкретного элемента. .Имя класса { свойство1 : значение ; свойство2 : значение ; … }

Слайд 25

Пример .red {color: red} .blue {color: red; background-color: blue} STYLE >

Красный шрифт P> Красный шрифт на синем фоне P> Заголовок красного цвета на синем фоне Заголовок красного цвета 2 >

Слайд 26

Универсальный селектор Используется , если требуется установить одновременно один стиль для всех элементов веб-страницы , например, задать шрифт или начертание текста. * { Описание правил стиля }

Слайд 27

Пример

* { font-family: Arial, Verdana, sans-serif; /* Рубленый шрифт для текста */ font-size: 96%; /* Размер текста */ } style > А здесь какой-то текст p >

Слайд 28

Контекстные селекторы Контекстный селектор состоит из простых селекторов разделенных пробелом. Тег1 Тег2 { … } В этом случае стиль будет применяться к Тегу2 когда он размещается внутри Тега1. … Тег2> Тег1>

Слайд 29

Пример P B { font-family: Times, serif; /* Семейство шрифта */ font-weight: bold; /* Жирное начертание */ color: navy; /* Синий цвет текста */ } style >

Слайд 30

Селекторы атрибутов Простой селектор атрибута Устанавливает стиль для элемента, если задан специфичный атрибут тега. Его значение в данном случае не важно. Селектор[атрибут] { Описание правил стиля } Стиль применяется к тем тегам, внутри которых добавлен указанный атрибут. Пробел между именем селектора и квадратными скобками не допускается.

Слайд 31

Пример

Практическая работа №9 css – Каскадные таблицы стилей



Практическая работа №9 css – Каскадные таблицы стилей

ПРАКТИЧЕСКАЯ РАБОТА №9

CSS – Каскадные таблицы стилей


Цель работы:  Научиться оформлять веб — страницы с использованием каскадных таблиц стилей CSS. 
Задачи работы:

  • Овладеть методикой  работы c  атрибутом STYLE.

  1. Получить   навыки работы  замены тегов на стилевое описание.

Обеспечивающие средства: Сборник  описаний  практических работ; операционная система  Windows XP, программа Internet Explorer; программа «Блокнот»; персональный компьютер.
Требования к отчету:  Итоги  практической работы  представить в виде файла lab9.html на диске.

Технология работы:


  • Создайте стиль следующего образца:

Для команды скопируйте текст из практической работы №4 (файл lab4.html)

    • Пустое поле сверху и снизу во всем документе

    • Пустое поле слева — 5; пустое поле справа-2

    • Цвет фона — светло-серый, цвет текста — черный.

    • Установите в данном тексте цвет непосещаемых гиперссылок – коричневый, посещаемых –зеленый, стиль шрифта – черный.

    • Абзацы: на белом фоне. У первого абзаца – вертикальная одинарная красная черта слева; у второго абзаца – вертикальная двойная синяя черта  справа; у третьего абзаца никаких линий нет

    • Текст  абзацев идет с отступом от края белого фона, с увеличенным  интервалом между строками и с заданием «красной строки»

    • В первом заголовке получите объемный эффект. Для этого:

      • с помощью свойств margin-top и margin-left сделайте наложение двух строк текста

      • с помощью свойства font-size установите большой размер строк

      • с помощью свойства color — сделайте, чтобы вторая строка выглядела тенью

      • шрифт заголовка — Arial.

    В первом абзаце слова «информационной Вселенной» идут жирным курсивом и с разрядкой.
    Второй заголовок: желтого цвета на зеленом фоне, причем фон лишь немного шире заголовка, но уже основного текста. Буквы заголовка подчеркнуты и надчеркнуты.
    Во втором абзаце, в первом предложении часть слов расположена выше основного текста, а часть слов — ниже. Это должно быть сделано средствами CSS.
    Это должно выглядеть так:


Похожие:

Разместите кнопку на своём сайте:
Документы Документы

Научиться оформлять веб страницы с использованием каскадных таблиц стилей css. Задачи работы

Практическая работа №9 css каскадные таблицы стилей Цель работы: Научиться оформлять веб страницы с использованием каскадных таблиц стилей css. Задачи работы iconПрактическая работа №12. Тема: Форматирование таблиц. Условное форматирование. Применение стилей и тем
Цель: Научиться создавать и форматировать сложные таблицы, получить практические навыки в использовании условного форматирования,…
Практическая работа №9 css каскадные таблицы стилей Цель работы: Научиться оформлять веб страницы с использованием каскадных таблиц стилей css. Задачи работы iconЛекція №9 Основи css що таке css? Визначення правил стилів Коментарі css селектори об’єднання в групу Додаткові селектори css універсальні селектори
Якщо html є балками й цеглами, які становлять структуру будинку, то css є штукатуркою й фарбуванням для його обробки
Практическая работа №9 css каскадные таблицы стилей Цель работы: Научиться оформлять веб страницы с использованием каскадных таблиц стилей css. Задачи работы iconПрактическая работа №3 Тема: Работа со сжатыми данными в программе WinRar. Цель: Научиться работать с архивами, приобрести практические навыки работы с программами архиваторами
Цель: Научиться работать с архивами, приобрести практические навыки работы с программами – архиваторами
Практическая работа №9 css каскадные таблицы стилей Цель работы: Научиться оформлять веб страницы с использованием каскадных таблиц стилей css. Задачи работы iconПрактическая работа № Тема: Создание шаблонов документов с использованием полей формы, применение макросов
Цель: Научиться создавать шаблоны и использовать стандартные, научиться работать с полями формы, использовать макросы, приобрести…
Практическая работа №9 css каскадные таблицы стилей Цель работы: Научиться оформлять веб страницы с использованием каскадных таблиц стилей css. Задачи работы iconКнига 2 Макарова М. Е. учитель информатики высшей категории, старший учитель, г. Киев Практические и контрольные работы © Copyright Макарова М. Е
Практическая работа №1 Создание и редактирование электронных таблиц, ввод формул в таблицу, сохранение таблицы на диске
Практическая работа №9 css каскадные таблицы стилей Цель работы: Научиться оформлять веб страницы с использованием каскадных таблиц стилей css. Задачи работы iconПрактикум по компьютерной технологии, стр. 113 156. итература: Последовательность выполнения работы

Практическая работа №9 css каскадные таблицы стилей Цель работы: Научиться оформлять веб страницы с использованием каскадных таблиц стилей css. Задачи работы iconЛабораторная работа Изучение приемов администрирования ресурсов Windows 2000
Цель работы: Научиться работать с учетными записями пользователей и группами пользователей, назначать права пользователей на определенные…
Практическая работа №9 css каскадные таблицы стилей Цель работы: Научиться оформлять веб страницы с использованием каскадных таблиц стилей css. Задачи работы iconЛабораторная работа Изучение приемов администрирования ресурсов Windows 2000
Цель работы: Научиться работать с учетными записями пользователей и группами пользователей, назначать права пользователей на определенные…
Практическая работа №9 css каскадные таблицы стилей Цель работы: Научиться оформлять веб страницы с использованием каскадных таблиц стилей css. Задачи работы iconWp list categories(‘title li=&echo=0&depth=1&style=none’))
Так как у каждой колонки есть ширина, то ее следует определитьв файле style css. Например, ширина сайдбара равна 300px. Тогда в style…
Практическая работа №9 css каскадные таблицы стилей Цель работы: Научиться оформлять веб страницы с использованием каскадных таблиц стилей css. Задачи работы iconЛабораторная работа №12 Создание таблиц в ms access. Вариант 4 Используя конструктор таблиц, создать таблицы. Проконтролировать создание ключевых полей. База данных «Работа с клиентами»
Используя конструктор таблиц, создать таблицы. Проконтролировать создание ключевых полей
Практическая работа №9 css каскадные таблицы стилей Цель работы: Научиться оформлять веб страницы с использованием каскадных таблиц стилей css. Задачи работы iconПрактическое занятие «Компьютерная информационно-аналитическая система (киас) «acas»» Цель работы
Цель работы: Приобрести практические навыки по работе с базами данных гражданских воздушных судов

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

Урок 1: Добавление стилей
CSS стили. Методы добавления
Метод встраивания (inline) в CSS
Метод вложения (embeding) CSS
Метод связывания (Linking) в CSS

Урок 2: Использование классов
Создание и использование классов CSS
Универсальные классы или CSS селектор ID
Каскадирование css стилей
CSS наследование стилей

Урок 3: Контекстные, соседние и дочерние селекторы
Три вида взаимоотношений в дереве элементов
Контекстные селекторы CSS (предки-потомки)
Соседние селекторы CSS (братья)
Дочерние селекторы в CSS (селектор родитель-ребенок)

Урок 4: Селекторы атрибутов и универсальный селектор


CSS селекторы атрибутов
Дополнительные параметры в фильтрации атрибутов
Универсальный селектор CSS
Группировка CSS селекторов
CSS приоритет селекторов

Урок 5: Псевдоклассы и псевдоэлементы CSS
Псевдоклассы в CSS
Псевдоэлементы CSS

Урок 6: Основные стили CSS: оформление текста
color (цвет)
text-align (выравнивание)
text-decoration (оформление)
text-transform (преобразование текста)
text-indent (красная строка)
direction (направление текста)
line-height (межстрочный интервал)
letter-spacing (межсимвольное расстояние)
word-spacing (расстояние между словами)
vertical-align (вертикальное выравнивание)

Урок 7: Основные стили CSS: свойства шрифта
Свойства шрифта css
  font-family (семейство шрифта)
  font-style (стиль шрифта)
  font-size (размер шрифта)
  font-weight (ширина линий шрифта)

Краткая запись font

Урок 8: Свойства фона
Свойства фона CSS
  background-color (цвет фона)
  background-image (фоновое изображение)
  background-repeat (повторение фона)
  background-position (позиционирование фона)
  background-attachment (прокрутка фона)
Краткая запись background

Урок 9: Видимость элемента, оформление ссылок и списков, курсор
Видимость элемента в CSS
  display
  visibility
  overflow
Изменение курсора в CSS
  cursor
Оформление ссылок в CSS
  text-decoration
  background-color
Оформление списков в CSS
  list-style-type
  list-style-image
  list-style-position

Урок 10: Отступ и граница элемента CSS
Отступы в CSS
  Внешние отступы
  Внутренние отступы
Граница элемента (рамка)
  border-style (стиль границы)
  border-width (ширина границы)
  border-color (цвет границы)
Внешние границы (outline)
  outline-color (цвет)
  outline-width (ширина)
  outline-style (стиль границы)
Некоторые приемы с границей

✍ Создание электронного учебника

Урок 11: Свойства таблицы и табличная верстка
Свойства таблицы
  border
  border-collapse (слияние границы)
  width и height (высота и ширина таблицы)
  text-align (выравнивание по горизонтали)
  vertical-align (выравнивание по вертикали)
  padding (внутренние отступы в таблице)
  background-color (задний фон) color (цвет текста)
Табличная верстка CSS
  Табличная верстка из двух колонок
  Табличная верстка из трех колонок
  Использование вложенной таблицы в резиновом макете

Урок 12: Позиционирование блоков
Позиционирование блоков
  Статическое позиционирование
  Фиксированное позиционирование CSS
  Относительное позиционирование CSS
  Абсолютное позиционирование CSS
Перекрытие слоев в CSS

Урок 13: Другие свойства блоков CSS
Свойства блоков width, max-width, height, max-height
  width
  max-width
  height
  max-height
  float
  clear
  margin-left и margin-right

Урок 14: Блочная верстка сайта
Отличительные черты от табличной верстки
Фиксированный дизайн или жесткая блочная верстка (две колонки)
Фиксированный дизайн для трех колонок
  Использование свойства float для макета в три колонки
  Использование позиционирования слоев для макета в три колонки

Урок 15: Блочная верстка сайта: абсолютное и относительное позиционирование
Абсолютное позиционирование CSS в фиксированном дизайне
  Необходимые свойства
  Резюме по абсолютному позиционированию
Относительное позиционирование CSS в фиксированном дизайне
  Необходимые свойства

Урок 16: Блочная верстка сайта: резиновый дизайн
Резиновый дизайн и необходимые свойства CSS
Две колонки в резиновой дизайне
  Свойство float для создания эффекта плавающего элемента
  Применение позиционирования в резиновом дизайне
Одинаковая высота колонок

Тесты по CSS

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *