예
의 사용 class HTML 문서 속성 :
<html>
<head>
<style>
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>
»그것을 자신을 시도 자세한 내용은 아래 예 "자신을보십시오."
정의 및 사용
class 속성은 요소의 하나 또는 그 이상의 클래스 이름을 지정합니다.
class 속성은 대부분 스타일 시트에서 클래스를 가리키는 데 사용됩니다. 그러나, 또한, 특정 클래스 HTML 요소을 변경합니다 (HTML DOM 통해) 자바 스크립트에 의해 사용될 수있다.
브라우저 지원
속성 | |||||
---|---|---|---|---|---|
class | 예 | 예 | 예 | 예 | 예 |
HTML 4.01과 HTML5의 차이점
HTML5에서, class 속성이어떤 HTML 요소에 사용될 수있다 (이것은 어떤 HTML 요소를 검증 할 것이다. 그러나, 그것은 반드시 도움이되지 않음).
HTML 4.01에서 class 속성을 사용할 수 없습니다 : <base>, <head>, <html>, <meta>, <param>, <script>, <style> , 그리고 <title> .
통사론
<elementclass="classname">
속성 값
값 | 기술 |
---|---|
classname | 요소의 하나 또는 그 이상의 클래스 이름을 지정합니다. 여러 클래스를 지정 공백으로 클래스 이름을 구분하기 위해, 예를 들어 <span class="left important"> . 이렇게하면 하나의 HTML 요소에 대해 여러 CSS 클래스를 결합 할 수 있습니다. 이름 지정 규칙 :
|
더 예
예
하나의 HTML 요소에 여러 클래스를 추가합니다 :
<!DOCTYPE html>
<html>
<head>
<style>
h1.intro {
color: blue;
text-align: center;
}
.important {
background-color: yellow;
}
</style>
</head>
<body>
<h1 class="intro
important">Header 1</h1>
<p>A paragraph.</p>
</body>
</html>
»그것을 자신을 시도 관련 페이지
HTML 자습서 : HTML 속성
CSS 자습서 : CSS 선택기
CSS 참조 : CSS .class 선택기
HTML DOM 참조 : HTML DOM getElementsByClassName() 메소드
HTML DOM 참조 : HTML DOM className 속성
HTML DOM 참조 : HTML DOM classList 부동산
HTML DOM 참조 : HTML DOM 스타일 개체