Home > Web Front-end > HTML Tutorial > The attribute class that specifies the class name of an element in html

The attribute class that specifies the class name of an element in html

黄舟
Release: 2017-11-03 09:38:46
Original
4873 people have browsed it

Examples

Using class in HTML documents Attributes:

<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
Copy after login

Definition and usage

The class attribute specifies elements The class name (classname).

The class attribute is most often used to point to a class in a style sheet. However, it can also be used to change HTML elements with specified classes through JavaScript.

Tips and Notes

Note: The class attribute cannot be used in the following HTML elements: base, head, html, meta, param, script, style and title.

Tip: You can assign multiple classes to HTML elements, for example: . This allows you to combine several CSS classes into one HTML element.

Tip: The class name cannot start with a number! Only Internet Explorer supports this practice.

Browser Support

W3C: The "W3C" column indicates whether the attribute is defined in the W3C's HTML/XHTML recommendations.

IEFirefoxOperaSafariW3C
YESYESYESYESYES

Syntax

<element class="value">
Copy after login

Attribute value

ValueDescription
classnameSpecifies the name of the element's class. To specify multiple classes for an element, separate the class names with spaces.

Example

<div class="dreamdu1">连接div标签与dreamdu1样式<div>
<div class="dreamdu12px dreamdublack dreamdubold">使用空格分开多个样式连接div标签<div>
Copy after login
div.dreamdu12px{	
font-size: 12px;}
div.dreamdublack{	
color: black;}
div.dreamdubold{	
font-weight: bold;}
Copy after login

You can use multiple classnames, but they must be separated by spaces

The above is the detailed content of The attribute class that specifies the class name of an element in html. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template