Что такое findslide.org?

FindSlide.org - это сайт презентаций, докладов, шаблонов в формате PowerPoint.


Для правообладателей

Обратная связь

Email: Нажмите что бы посмотреть 

Яндекс.Метрика

Презентация на тему Идентификация и группирование элементов (class и id)

Цель:Уметь применять особый стиль к определённому элементу или конкретной группе элементов
Тема :Идентификация и группирование элементов (class и id) Цель:Уметь применять особый стиль к определённому элементу или конкретной группе элементов Ключевые словаCLASSID Группирование элементов с помощью classесть два списка ссылок сортов винограда - для Далее, необходимо, чтобы ссылки на белое вино были жёлтого цвета, на красное a { color: blue; } a.whitewine { color: #FFBB00; } a.redwine { color: #800000; } Пример Идентификация элемента с помощью idПомимо группирования элементов вам может понадобиться идентифицировать один ВопросыДля чего предназначены эти селектора ?Чем отличается селектор id от селектора class? Дом. задание http://ru.html.net/tutorials/css/lesson8.php
Слайды презентации

Слайд 2 Цель:
Уметь применять особый стиль к определённому элементу или

Цель:Уметь применять особый стиль к определённому элементу или конкретной группе элементов

конкретной группе элементов


Слайд 3 Ключевые слова
CLASS
ID

Ключевые словаCLASSID

Слайд 4 Группирование элементов с помощью class
есть два списка ссылок

Группирование элементов с помощью classесть два списка ссылок сортов винограда -

сортов винограда - для белого и для красного вина.

HTML-код может быть таким:

Виноград для белого вина:



Виноград для красного вина:



Пример


Слайд 5 Далее, необходимо, чтобы ссылки на белое вино были

Далее, необходимо, чтобы ссылки на белое вино были жёлтого цвета, на

жёлтого цвета, на красное вино - красного, а остальные

ссылки на этой же странице оставались синими.

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

Виноград для белого вина:



Виноград для красного вина:




Слайд 6 a {
color: blue;
}
a.whitewine {
color:

a { color: blue; } a.whitewine { color: #FFBB00; } a.redwine { color: #800000; } Пример

#FFBB00;
}
a.redwine {
color: #800000;
}
Пример


Слайд 7 Идентификация элемента с помощью id
Помимо группирования элементов вам

Идентификация элемента с помощью idПомимо группирования элементов вам может понадобиться идентифицировать

может понадобиться идентифицировать один уникальный элемент. Это можно реализовать

с помощью атрибута id.

Особенность id в том, что в документе не может быть более одного элемента с данным конкретным id. Каждый id должен быть уникальным. В других случаях используйте атрибут class.

Глава 1


...

Глава 1.1


...

Глава 1.2


...

Глава 2


...

Глава 2.1


...

Глава 2.1.2


ПРИМЕР


Слайд 8


Глава 1
...
Глава 1.1
...

id="c1-2">Глава 1.2
...

Глава 2


...

Глава 2.1


...

Глава 2.1.2




id.css

#c1-2
{
color:
red;
}

ПРИМЕР


Слайд 9 Вопросы
Для чего предназначены эти селектора ?

Чем отличается селектор

ВопросыДля чего предназначены эти селектора ?Чем отличается селектор id от селектора class?

id от селектора class?


  • Имя файла: identifikatsiya-i-gruppirovanie-elementov-class-i-id.pptx
  • Количество просмотров: 108
  • Количество скачиваний: 0