CSS :: Селектор по классу

Селектор по классу (от англ. class selector – селектор по классу) выбирает все элементы, у которых в качестве значения атрибута class указано имя селектора. При этом сам селектор по классу начинается с точки, после которой следует имя селектора (класса), например, .my_class {блок объявлений}.

Синтаксис

.className {блок объявлений}

Ссылки

Официальный сайт W3C: https://www.w3.org/TR/selectors-3/#class-html

Статья на Mozilla Firefox: https://developer.mozilla.org/ru/docs/Web/CSS/Class_selectors

Примеры

HTML Результат

htmlCodes

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">  
	<title>Пример №1</title>

	<style>
		
		/* Селектор по классу выбирает элементы */
		/* с соответствующим значением атрибута class, */
		/* как, например, <p class="my_class">абзац</p> */

		.my_class{
		color: blue;			 
		font-weight: bold;	 
		}
		
	</style>
	
</head>
<body>

	<p class="my_class">
		color: blue;<br>      
		font-weight: bold;				
	</p>

	<div>
		Для этого элемента наш класс my_class не применяется.
	</div>	
			
	<pre class="my_class">
		color: blue;      
		font-weight: bold;
	</pre>		
	
</body>
</html>

Пример №1