Лондон Париж Токио Использование атрибута class для встроенных элементов Атрибут class также может быть использован для встроенных элементов: Пример Мой Important Заголовок Это уже кое-что important text. Совет: Атрибут class может быть использован на каждом HTML элементе. Примечание: Имя класса чувствительно к регистру! Совет: Вы можете узнать гораздо больше о CSS в разделе CSS Учебник. Определение стилей для класса Чтобы определить свойства CSS для класса, напишите точку (.) символ, за которым следует название класса. Затем добавьте свойства CSS в фигурные скобки <>: Пример Стиль всех элементов с именем класса «city»: class=»city»>Лондон Лондон — столица Англии. class=»city»>Париж Париж — столица Франции. class=»city»>Токио Токио — столица Японии. Лондон Париж Токио Несколько классов HTML элементы могут иметь более одного имени класса. Чтобы указать несколько классов, разделите имена классов пробелом, например . Это позволяет объединить несколько классов CSS для одного HTML элемента. В следующем примере первый элемент принадлежит обоим классам city , а также к классу main , и получит стили CSS от обоих классов: Пример Лондон Различные элементы могут иметь один и тот же класс Различные HTML элементы могут указывать на одно и то же имя класса. В следующем примере оба варианта и указывает на то, что класс «city» будет разделять один и тот же стиль: Пример Использование атрибута class в JavaScript Имя класса также может использоваться JavaScript для выполнения определенных задач для определенных элементов. JavaScript может получить доступ к элементам с определенным именем класса с помощью метода getElementsByClassName() : Пример Нажмите на кнопку, чтобы скрыть все элементы с именем класса «city»: Не волнуйтесь, если вы не понимаете код в приведенном выше примере. Вы узнаете больше о JavaScript в разделе HTML JavaScript, или вы можете изучить, JavaScript Учебник. Краткое содержание главы HTML атрибут class указывает одно или несколько имен классов для элемента Классы используются CSS и JavaScript для выбора и доступа к определенным элементам Атрибут class может быть использован для любого HTML элемента Имя класса чувствительно к регистру Различные элементы HTML могут указывать на одно и то же имя класса JavaScript может получить доступ к элементам с определенным именем класса с помощью мтода getElementsByClassName() HTML Упражнения Мы только что запустили SchoolsW3 видео Сообщить об ошибке Если вы хотите сообщить об ошибке или внести предложение, не стесняйтесь отправлять на электронное письмо: Ваше предложение: Спасибо Вам за то, что помогаете! Ваше сообщение было отправлено в SchoolsW3. ТОП Учебники ТОП Справочники ТОП Примеры SchoolsW3 оптимизирован для бесплатного обучения, проверки и подготовки знаний. Примеры в редакторе упрощают и улучшают чтение и базовое понимание. Учебники, ссылки, примеры постоянно пересматриваются, чтобы избежать ошибок, но не возможно гарантировать полную правильность всего содержания. Некоторые страницы сайта могут быть не переведены на РУССКИЙ язык, можно отправить страницу как ошибку, так же можете самостоятельно заняться переводом. Используя данный сайт, вы соглашаетесь прочитать и принять Условия к использованию, Cookies и политика конфиденциальности. Источник Классы Классы применяют, когда необходимо определить стиль для индивидуального элемента веб-страницы или задать разные стили для одного тега. При использовании совместно с тегами синтаксис для классов будет следующий. Внутри стиля вначале пишется желаемый тег, а затем, через точку пользовательское имя класса. Имена классов должны начинаться с латинского символа и могут содержать в себе символ дефиса (-) и подчеркивания (_). Использование русских букв в именах классов недопустимо. Чтобы указать в коде HTML, что тег используется с определённым классом, к тегу добавляется атрибут class=»Имя класса» (пример 8.1). Пример 8.1. Использование классов HTML5 CSS 2.1 IE Cr Op Sa Fx
Для искусственного освещения помещения применяются люминесцентные лампы. Они отличаются высокой световой отдачей, продолжительным сроком службы, малой яркостью светящейся поверхности, близким к естественному спектральным составом излучаемого света, что обеспечивает хорошую цветопередачу.
Результат данного примера показан на рис. 8.1. Рис. 8.1. Вид текста, оформленного с помощью стилевых классов Первый абзац выровнен по ширине с текстом чёрного цвета (этот цвет задаётся браузером по умолчанию), а следующий, к которому применен класс с именем cite — отображается синим цветом и с линией слева. Можно, также, использовать классы и без указания тега. Синтаксис в этом случае будет следующий. При такой записи класс можно применять к любому тегу (пример 8.2). Пример 8.2. Использование классов HTML5 CSS 2.1 IE Cr Op Sa Fx
Согласно , шумовой характеристикой рабочих мест при постоянном шуме являются уровни звуковых давлений в децибелах в октавных полосах. Совокупность таких уровней называется , номер которого численно равен уровню звукового давления в октавной полосе со среднегеометрической частотой 1000 Гц.
Результат применения классов к тегам и показан на рис. 8.2. Рис. 8.2. Вид тегов, оформленных с помощью классов Классы удобно использовать, когда нужно применить стиль к разным элементам веб-страницы: ячейкам таблицы, ссылкам, абзацам и др. В примере 8.3 показано изменение цвета фона строк таблицы для создания «зебры». Пример 8.3. Использование классов HTML5 CSS 2.1 IE Cr Op Sa Fx
Название
Цвет
Твердость по Моосу
Алмаз
Белый
10
Рубин
Красный
9
Аметист
Голубой
7
Изумруд
Зеленый
8
Сапфир
Голубой
9
Рис. 8.3. Результат применения классов Одновременное использование разных классов К любому тегу одновременно можно добавить несколько классов, перечисляя их в атрибуте class через пробел. В этом случае к элементу применяется стиль, описанный в правилах для каждого класса. Поскольку при добавлении нескольких классов они могут содержать одинаковые стилевые свойства, но с разными значениями, то берётся значение у класса, который описан в коде ниже. В примере 8.4 показано использование разных классов для создания облака тегов. Пример 8.4. Сочетание разных классов HTML5 CSS 2.1 IE Cr Op Sa Fx
Paint.NET Photoshop цвет фон палитра слои свет панели линия прямоугольник пиксел градиент
Результат данного примера показан на рис. 8.4. В стилях также допускается использовать запись вида .layer1.layer2 , где layer1 и layer2 представляют собой имена классов. Стиль применяется только для элементов, у которых одновременно заданы классы layer1 и layer2 . Вопросы для проверки 1. Какое имя класса написано правильно? 2. Какой цвет будет у слова «потока» в коде? При использовании следующего стиля? 4. Какое имя класса следует добавить к тегу , чтобы текст был одновременно жирным и красного цвета, если имеется следующий стиль? Источник
A paragraph. Example Using JavaScript to add a yellow background color to the first element with class=»example» (index 0). Example Using JavaScript to add the «mystyle» class to an element with > Related Pages COLOR PICKER Report Error If you want to report an error, or if you want to make a suggestion, do not hesitate to send us an e-mail: Thank You For Helping Us! Your message has been sent to W3Schools. Top Tutorials Top References Top Examples Get Certified W3Schools is optimized for learning and training. Examples might be simplified to improve reading and learning. Tutorials, references, and examples are constantly reviewed to avoid errors, but we cannot warrant full correctness of all content. While using W3Schools, you agree to have read and accepted our terms of use, cookie and privacy policy. Источник
Лондон Париж Токио Использование атрибута class для встроенных элементов Атрибут class также может быть использован для встроенных элементов: Пример Мой Important Заголовок Это уже кое-что important text. Совет: Атрибут class может быть использован на каждом HTML элементе. Примечание: Имя класса чувствительно к регистру! Совет: Вы можете узнать гораздо больше о CSS в разделе CSS Учебник. Определение стилей для класса Чтобы определить свойства CSS для класса, напишите точку (.) символ, за которым следует название класса. Затем добавьте свойства CSS в фигурные скобки <>: Пример Стиль всех элементов с именем класса «city»: class=»city»>Лондон Лондон — столица Англии. class=»city»>Париж Париж — столица Франции. class=»city»>Токио Токио — столица Японии. Лондон Париж Токио Несколько классов HTML элементы могут иметь более одного имени класса. Чтобы указать несколько классов, разделите имена классов пробелом, например . Это позволяет объединить несколько классов CSS для одного HTML элемента. В следующем примере первый элемент принадлежит обоим классам city , а также к классу main , и получит стили CSS от обоих классов: Пример Лондон Различные элементы могут иметь один и тот же класс Различные HTML элементы могут указывать на одно и то же имя класса. В следующем примере оба варианта и указывает на то, что класс «city» будет разделять один и тот же стиль: Пример Использование атрибута class в JavaScript Имя класса также может использоваться JavaScript для выполнения определенных задач для определенных элементов. JavaScript может получить доступ к элементам с определенным именем класса с помощью метода getElementsByClassName() : Пример Нажмите на кнопку, чтобы скрыть все элементы с именем класса «city»: Не волнуйтесь, если вы не понимаете код в приведенном выше примере. Вы узнаете больше о JavaScript в разделе HTML JavaScript, или вы можете изучить, JavaScript Учебник. Краткое содержание главы HTML атрибут class указывает одно или несколько имен классов для элемента Классы используются CSS и JavaScript для выбора и доступа к определенным элементам Атрибут class может быть использован для любого HTML элемента Имя класса чувствительно к регистру Различные элементы HTML могут указывать на одно и то же имя класса JavaScript может получить доступ к элементам с определенным именем класса с помощью мтода getElementsByClassName() HTML Упражнения Мы только что запустили SchoolsW3 видео Сообщить об ошибке Если вы хотите сообщить об ошибке или внести предложение, не стесняйтесь отправлять на электронное письмо: Ваше предложение: Спасибо Вам за то, что помогаете! Ваше сообщение было отправлено в SchoolsW3. ТОП Учебники ТОП Справочники ТОП Примеры SchoolsW3 оптимизирован для бесплатного обучения, проверки и подготовки знаний. Примеры в редакторе упрощают и улучшают чтение и базовое понимание. Учебники, ссылки, примеры постоянно пересматриваются, чтобы избежать ошибок, но не возможно гарантировать полную правильность всего содержания. Некоторые страницы сайта могут быть не переведены на РУССКИЙ язык, можно отправить страницу как ошибку, так же можете самостоятельно заняться переводом. Используя данный сайт, вы соглашаетесь прочитать и принять Условия к использованию, Cookies и политика конфиденциальности. Источник Классы Классы применяют, когда необходимо определить стиль для индивидуального элемента веб-страницы или задать разные стили для одного тега. При использовании совместно с тегами синтаксис для классов будет следующий. Внутри стиля вначале пишется желаемый тег, а затем, через точку пользовательское имя класса. Имена классов должны начинаться с латинского символа и могут содержать в себе символ дефиса (-) и подчеркивания (_). Использование русских букв в именах классов недопустимо. Чтобы указать в коде HTML, что тег используется с определённым классом, к тегу добавляется атрибут class=»Имя класса» (пример 8.1). Пример 8.1. Использование классов HTML5 CSS 2.1 IE Cr Op Sa Fx
Для искусственного освещения помещения применяются люминесцентные лампы. Они отличаются высокой световой отдачей, продолжительным сроком службы, малой яркостью светящейся поверхности, близким к естественному спектральным составом излучаемого света, что обеспечивает хорошую цветопередачу.
Результат данного примера показан на рис. 8.1. Рис. 8.1. Вид текста, оформленного с помощью стилевых классов Первый абзац выровнен по ширине с текстом чёрного цвета (этот цвет задаётся браузером по умолчанию), а следующий, к которому применен класс с именем cite — отображается синим цветом и с линией слева. Можно, также, использовать классы и без указания тега. Синтаксис в этом случае будет следующий. При такой записи класс можно применять к любому тегу (пример 8.2). Пример 8.2. Использование классов HTML5 CSS 2.1 IE Cr Op Sa Fx
Согласно , шумовой характеристикой рабочих мест при постоянном шуме являются уровни звуковых давлений в децибелах в октавных полосах. Совокупность таких уровней называется , номер которого численно равен уровню звукового давления в октавной полосе со среднегеометрической частотой 1000 Гц.
Результат применения классов к тегам и показан на рис. 8.2. Рис. 8.2. Вид тегов, оформленных с помощью классов Классы удобно использовать, когда нужно применить стиль к разным элементам веб-страницы: ячейкам таблицы, ссылкам, абзацам и др. В примере 8.3 показано изменение цвета фона строк таблицы для создания «зебры». Пример 8.3. Использование классов HTML5 CSS 2.1 IE Cr Op Sa Fx
Название
Цвет
Твердость по Моосу
Алмаз
Белый
10
Рубин
Красный
9
Аметист
Голубой
7
Изумруд
Зеленый
8
Сапфир
Голубой
9
Рис. 8.3. Результат применения классов Одновременное использование разных классов К любому тегу одновременно можно добавить несколько классов, перечисляя их в атрибуте class через пробел. В этом случае к элементу применяется стиль, описанный в правилах для каждого класса. Поскольку при добавлении нескольких классов они могут содержать одинаковые стилевые свойства, но с разными значениями, то берётся значение у класса, который описан в коде ниже. В примере 8.4 показано использование разных классов для создания облака тегов. Пример 8.4. Сочетание разных классов HTML5 CSS 2.1 IE Cr Op Sa Fx
Paint.NET Photoshop цвет фон палитра слои свет панели линия прямоугольник пиксел градиент
Результат данного примера показан на рис. 8.4. В стилях также допускается использовать запись вида .layer1.layer2 , где layer1 и layer2 представляют собой имена классов. Стиль применяется только для элементов, у которых одновременно заданы классы layer1 и layer2 . Вопросы для проверки 1. Какое имя класса написано правильно? 2. Какой цвет будет у слова «потока» в коде? При использовании следующего стиля? 4. Какое имя класса следует добавить к тегу , чтобы текст был одновременно жирным и красного цвета, если имеется следующий стиль? Источник
A paragraph. Example Using JavaScript to add a yellow background color to the first element with class=»example» (index 0). Example Using JavaScript to add the «mystyle» class to an element with > Related Pages COLOR PICKER Report Error If you want to report an error, or if you want to make a suggestion, do not hesitate to send us an e-mail: Thank You For Helping Us! Your message has been sent to W3Schools. Top Tutorials Top References Top Examples Get Certified W3Schools is optimized for learning and training. Examples might be simplified to improve reading and learning. Tutorials, references, and examples are constantly reviewed to avoid errors, but we cannot warrant full correctness of all content. While using W3Schools, you agree to have read and accepted our terms of use, cookie and privacy policy. Источник
Рис. 8.3. Результат применения классов Одновременное использование разных классов К любому тегу одновременно можно добавить несколько классов, перечисляя их в атрибуте class через пробел. В этом случае к элементу применяется стиль, описанный в правилах для каждого класса. Поскольку при добавлении нескольких классов они могут содержать одинаковые стилевые свойства, но с разными значениями, то берётся значение у класса, который описан в коде ниже. В примере 8.4 показано использование разных классов для создания облака тегов. Пример 8.4. Сочетание разных классов HTML5 CSS 2.1 IE Cr Op Sa Fx
Paint.NET Photoshop цвет фон палитра слои свет панели линия прямоугольник пиксел градиент
Результат данного примера показан на рис. 8.4. В стилях также допускается использовать запись вида .layer1.layer2 , где layer1 и layer2 представляют собой имена классов. Стиль применяется только для элементов, у которых одновременно заданы классы layer1 и layer2 . Вопросы для проверки 1. Какое имя класса написано правильно? 2. Какой цвет будет у слова «потока» в коде? При использовании следующего стиля? 4. Какое имя класса следует добавить к тегу , чтобы текст был одновременно жирным и красного цвета, если имеется следующий стиль? Источник
A paragraph. Example Using JavaScript to add a yellow background color to the first element with class=»example» (index 0). Example Using JavaScript to add the «mystyle» class to an element with > Related Pages COLOR PICKER Report Error If you want to report an error, or if you want to make a suggestion, do not hesitate to send us an e-mail: Thank You For Helping Us! Your message has been sent to W3Schools. Top Tutorials Top References Top Examples Get Certified W3Schools is optimized for learning and training. Examples might be simplified to improve reading and learning. Tutorials, references, and examples are constantly reviewed to avoid errors, but we cannot warrant full correctness of all content. While using W3Schools, you agree to have read and accepted our terms of use, cookie and privacy policy. Источник
Рис. 8.3. Результат применения классов Одновременное использование разных классов К любому тегу одновременно можно добавить несколько классов, перечисляя их в атрибуте class через пробел. В этом случае к элементу применяется стиль, описанный в правилах для каждого класса. Поскольку при добавлении нескольких классов они могут содержать одинаковые стилевые свойства, но с разными значениями, то берётся значение у класса, который описан в коде ниже. В примере 8.4 показано использование разных классов для создания облака тегов. Пример 8.4. Сочетание разных классов HTML5 CSS 2.1 IE Cr Op Sa Fx
Paint.NET Photoshop цвет фон палитра слои свет панели линия прямоугольник пиксел градиент
Результат данного примера показан на рис. 8.4. В стилях также допускается использовать запись вида .layer1.layer2 , где layer1 и layer2 представляют собой имена классов. Стиль применяется только для элементов, у которых одновременно заданы классы layer1 и layer2 . Вопросы для проверки 1. Какое имя класса написано правильно? 2. Какой цвет будет у слова «потока» в коде? При использовании следующего стиля? 4. Какое имя класса следует добавить к тегу , чтобы текст был одновременно жирным и красного цвета, если имеется следующий стиль? Источник
The HTML class attribute is used to specify a class for an HTML element.
Multiple HTML elements can share the same class.
Using The class Attribute
The class attribute is often used to point to a class name in a style sheet. It can also be used by a JavaScript to access and manipulate elements with the specific class name.
In the following example we have three elements with a class attribute with the value of «city». All of the three elements will be styled equally according to the .city style definition in the head section:
Example
London
London is the capital of England.
Paris
Paris is the capital of France.
Tokyo
Tokyo is the capital of Japan.
In the following example we have two elements with a class attribute with the value of «note». Both elements will be styled equally according to the .note style definition in the head section:
Example
My Important Heading
This is some important text.
Tip: The class attribute can be used on any HTML element.
Note: The class name is case sensitive!
Tip: You can learn much more about CSS in our CSS Tutorial.
The Syntax For Class
To create a class; write a period (.) character, followed by a class name. Then, define the CSS properties within curly braces <>:
To define multiple classes, separate the class names with a space, e.g. . The element will be styled according to all the classes specified.
In the following example, the first element belongs to both the city class and also to the main class, and will get the CSS styles from both of the classes:
Example
London
Different Elements Can Share Same Class
Different HTML elements can point to the same class name.
In the following example, both and
point to the «city» class and will share the same style:
Example
Use of The class Attribute in JavaScript
The class name can also be used by JavaScript to perform certain tasks for specific elements.
JavaScript can access elements with a specific class name with the getElementsByClassName() method:
Example
Click on a button to hide all elements with the class name «city»:
Don’t worry if you don’t understand the code in the example above.
You will learn more about JavaScript in our HTML JavaScript chapter, or you can study our JavaScript Tutorial.
Chapter Summary
The HTML class attribute specifies one or more class names for an element
Classes are used by CSS and JavaScript to select and access specific elements
The class attribute can be used on any HTML element
The class name is case sensitive
Different HTML elements can point to the same class name
JavaScript can access elements with a specific class name with the getElementsByClassName() method
HTML атрибут class используется для указания класса для элемента HTML.
Несколько HTML элементов могут совместно использовать один и тот же класс.
Использование атрибута class
Атрибут class часто используется для указания на имя класса в таблице стилей. Он также может быть использован JavaScript для доступа и манипулирования элементами с определенным именем класса.
В следующем примере мы имеем три элемента с атрибутом class и со значением «city». Все три элемента будут стилизованы одинаково в соответствии с определением стиля .city в головном разделе:
Пример
Лондон
Лондон — столица Англии.
Париж
Париж — столица Франции.
Токио
Токио — столица Японии.
Лондон
Париж
Токио
Использование атрибута class для встроенных элементов
Атрибут class также может быть использован для встроенных элементов:
Пример
Мой Important Заголовок
Это уже кое-что important text.
Совет: Атрибут class может быть использован на каждом HTML элементе.
Примечание: Имя класса чувствительно к регистру!
Совет: Вы можете узнать гораздо больше о CSS в разделе CSS Учебник.
Определение стилей для класса
Чтобы определить свойства CSS для класса, напишите точку (.) символ, за которым следует название класса. Затем добавьте свойства CSS в фигурные скобки <>:
Пример
Стиль всех элементов с именем класса «city»:
class=»city»>Лондон
Лондон — столица Англии.
class=»city»>Париж
Париж — столица Франции.
class=»city»>Токио
Токио — столица Японии.
Лондон
Париж
Токио
Несколько классов
HTML элементы могут иметь более одного имени класса.
Чтобы указать несколько классов, разделите имена классов пробелом, например . Это позволяет объединить несколько классов CSS для одного HTML элемента.
В следующем примере первый элемент принадлежит обоим классам city , а также к классу main , и получит стили CSS от обоих классов:
Пример
Лондон
Различные элементы могут иметь один и тот же класс
Различные HTML элементы могут указывать на одно и то же имя класса.
В следующем примере оба варианта и
указывает на то, что класс «city» будет разделять один и тот же стиль:
Пример
Использование атрибута class в JavaScript
Имя класса также может использоваться JavaScript для выполнения определенных задач для определенных элементов.
JavaScript может получить доступ к элементам с определенным именем класса с помощью метода getElementsByClassName() :
Пример
Нажмите на кнопку, чтобы скрыть все элементы с именем класса «city»:
Не волнуйтесь, если вы не понимаете код в приведенном выше примере.
Вы узнаете больше о JavaScript в разделе HTML JavaScript, или вы можете изучить, JavaScript Учебник.
Краткое содержание главы
HTML атрибут class указывает одно или несколько имен классов для элемента
Классы используются CSS и JavaScript для выбора и доступа к определенным элементам
Атрибут class может быть использован для любого HTML элемента
Имя класса чувствительно к регистру
Различные элементы HTML могут указывать на одно и то же имя класса
JavaScript может получить доступ к элементам с определенным именем класса с помощью мтода getElementsByClassName()
HTML Упражнения
Мы только что запустили SchoolsW3 видео
Сообщить об ошибке
Если вы хотите сообщить об ошибке или внести предложение, не стесняйтесь отправлять на электронное письмо:
Ваше предложение:
Спасибо Вам за то, что помогаете!
Ваше сообщение было отправлено в SchoolsW3.
ТОП Учебники
ТОП Справочники
ТОП Примеры
SchoolsW3 оптимизирован для бесплатного обучения, проверки и подготовки знаний. Примеры в редакторе упрощают и улучшают чтение и базовое понимание. Учебники, ссылки, примеры постоянно пересматриваются, чтобы избежать ошибок, но не возможно гарантировать полную правильность всего содержания. Некоторые страницы сайта могут быть не переведены на РУССКИЙ язык, можно отправить страницу как ошибку, так же можете самостоятельно заняться переводом. Используя данный сайт, вы соглашаетесь прочитать и принять Условия к использованию, Cookies и политика конфиденциальности.
Классы применяют, когда необходимо определить стиль для индивидуального элемента веб-страницы или задать разные стили для одного тега. При использовании совместно с тегами синтаксис для классов будет следующий.
Внутри стиля вначале пишется желаемый тег, а затем, через точку пользовательское имя класса. Имена классов должны начинаться с латинского символа и могут содержать в себе символ дефиса (-) и подчеркивания (_). Использование русских букв в именах классов недопустимо. Чтобы указать в коде HTML, что тег используется с определённым классом, к тегу добавляется атрибут class=»Имя класса» (пример 8.1).
Пример 8.1. Использование классов
HTML5 CSS 2.1 IE Cr Op Sa Fx
Для искусственного освещения помещения применяются люминесцентные лампы. Они отличаются высокой световой отдачей, продолжительным сроком службы, малой яркостью светящейся поверхности, близким к естественному спектральным составом излучаемого света, что обеспечивает хорошую цветопередачу.
Результат данного примера показан на рис. 8.1.
Рис. 8.1. Вид текста, оформленного с помощью стилевых классов
Первый абзац выровнен по ширине с текстом чёрного цвета (этот цвет задаётся браузером по умолчанию), а следующий, к которому применен класс с именем cite — отображается синим цветом и с линией слева.
Можно, также, использовать классы и без указания тега. Синтаксис в этом случае будет следующий.
При такой записи класс можно применять к любому тегу (пример 8.2).
Пример 8.2. Использование классов
HTML5 CSS 2.1 IE Cr Op Sa Fx
Согласно , шумовой характеристикой рабочих мест при постоянном шуме являются уровни звуковых давлений в децибелах в октавных полосах. Совокупность таких уровней называется , номер которого численно равен уровню звукового давления в октавной полосе со среднегеометрической частотой 1000 Гц.
Результат применения классов к тегам и показан на рис. 8.2.
Рис. 8.2. Вид тегов, оформленных с помощью классов
Классы удобно использовать, когда нужно применить стиль к разным элементам веб-страницы: ячейкам таблицы, ссылкам, абзацам и др. В примере 8.3 показано изменение цвета фона строк таблицы для создания «зебры».
Пример 8.3. Использование классов
HTML5 CSS 2.1 IE Cr Op Sa Fx
Название
Цвет
Твердость по Моосу
Алмаз
Белый
10
Рубин
Красный
9
Аметист
Голубой
7
Изумруд
Зеленый
8
Сапфир
Голубой
9
Рис. 8.3. Результат применения классов
Одновременное использование разных классов
К любому тегу одновременно можно добавить несколько классов, перечисляя их в атрибуте class через пробел. В этом случае к элементу применяется стиль, описанный в правилах для каждого класса. Поскольку при добавлении нескольких классов они могут содержать одинаковые стилевые свойства, но с разными значениями, то берётся значение у класса, который описан в коде ниже.
В примере 8.4 показано использование разных классов для создания облака тегов.
Пример 8.4. Сочетание разных классов
HTML5 CSS 2.1 IE Cr Op Sa Fx
Paint.NET Photoshop цвет фон палитра слои свет панели линия прямоугольник пиксел градиент
Результат данного примера показан на рис. 8.4.
В стилях также допускается использовать запись вида .layer1.layer2 , где layer1 и layer2 представляют собой имена классов. Стиль применяется только для элементов, у которых одновременно заданы классы layer1 и layer2 .
Вопросы для проверки
1. Какое имя класса написано правильно?
2. Какой цвет будет у слова «потока» в коде?
При использовании следующего стиля?
4. Какое имя класса следует добавить к тегу , чтобы текст был одновременно жирным и красного цвета, если имеется следующий стиль?
The class attribute specifies one or more class names for an element.
The class attribute is mostly used to point to a class in a style sheet. However, it can also be used by a JavaScript (via the HTML DOM) to make changes to HTML elements with a specified class.
Browser Support
Syntax
Attribute Values
Value
Description
classname
Specifies one or more class names for an element. To specify multiple classes, separate the class names with a space, e.g. . This allows you to combine several CSS classes for one HTML element.
Must begin with a letter A-Z or a-z
Can be followed by: letters (A-Za-z), digits (0-9), hyphens («-«), and underscores («_»)
More Examples
Example
Add multiple classes to one HTML element:
Header 1
A paragraph.
Example
Using JavaScript to add a yellow background color to the first element with class=»example» (index 0).
Example
Using JavaScript to add the «mystyle» class to an element with >
Related Pages
COLOR PICKER
Report Error
If you want to report an error, or if you want to make a suggestion, do not hesitate to send us an e-mail:
Thank You For Helping Us!
Your message has been sent to W3Schools.
Top Tutorials
Top References
Top Examples
Get Certified
W3Schools is optimized for learning and training. Examples might be simplified to improve reading and learning. Tutorials, references, and examples are constantly reviewed to avoid errors, but we cannot warrant full correctness of all content. While using W3Schools, you agree to have read and accepted our terms of use, cookie and privacy policy.
