 |
Пример 12.2. Контекстные и дочерние селекторы
|
|
|
|
HTML5CSS 2.1IECrOpSaFx
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8" >
<title> Дочерние селекторы </title>
<style>
DIV I { /* Контекстный селектор */
color: green; /* Зеленый цвет текста */
}
P > I { /* Дочерний селектор */
color: red; /* Красный цвет текста */
}
</style>
</head>
<body>
<div>
<p><i> Lorem ipsum dolor sit amet </i>, consectetuer adipiscing
elit, sed diem nonummy nibh euismod tincidunt ut lacreet <i> dolore magna </i>
aliguam erat volutpat. </p>
</div>
</body>
</html>
Результат данного примера показан на рис. 12.2.
Рис. 12.2. Цвет текста, заданный с помощью дочернего селектора
На тег <i> в примере действуют одновременно два правила: контекстный селектор (тег <i> расположен внутри <div>) и дочерний селектор (тег <i> является дочерним по отношению к <p>). При этом правила являются равносильными, поскольку все условия для них выполняются и не противоречат друг другу. В подобных случаях применяется стиль, который расположен в коде ниже, поэтому курсивный текст отображается красным цветом. Стоит поменять правила местами и поставить DIV I ниже, как цвет текста изменится с красного на зеленый.
Заметим, что в большинстве случаев от добавления дочерних селекторов можно отказаться, заменив их контекстными селекторами. Однако использование дочерних селекторов расширяет возможности по управлению стилями элементов, что в итоге позволяет получить нужный результат, а также простой и наглядный код.
Удобнее всего применять указанные селекторы для элементов, которые обладают иерархической структурой — сюда относятся, например, таблицы и разные списки. В примере 12.3 показано изменение вида списка с помощью стилей. За счёт вложения одного списка в другой получаем разновидность меню. Заголовки при этом располагаются горизонтально, а набор ссылок — вертикально под заголовками (рис. 12.3).
|
|
|
Рис. 12.3. Список в виде меню
Для размещения текста по горизонтали к селектору LI добавляется стилевое свойство float. Чтобы при этом разделить между собой стиль горизонтального и вертикального списка и применяются дочерние селекторы (пример 12.3).
|
|
|
b) Пример классического.
Q Приведите, пожалуйста примеры нарушений выполнения этой пробы при различных видах афазий.
Q Приведите, пожалуйста, примеры подобных нарушений внимания. Наиболее показательные примеры, на наш взгляд, относятся к сфере интеллектуальной деятельности и памяти.
V. Соотношение содержания стандартов и примерных программ
VI. 8. Примерный список вопросов по предмету.
XIII. Типичные ошибки изложения, вызванные нарушением логического закона тождества (с примерами)
XIV. Типичные ошибки изложения, вызванные нарушением логического закона противоречия (с примерами)
XVI. Типичные ошибки изложения, вызванные нарушением закона достаточного основания (с примерами)
А как вам такой пример?
Авторская песня. (На примере одного- двух произведений любого автора.) (Билет 24)
