HTML class Attribute

ตัวอย่าง

การใช้งานของ 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 แอตทริบิวต์ระบุหนึ่งหรือมากกว่า classnames สำหรับองค์ประกอบ

class แอตทริบิวต์ส่วนใหญ่จะใช้ในการชี้ไปที่ระดับในสไตล์ชี แต่ก็ยังสามารถนำมาใช้โดย JavaScript (ผ่าน DOM HTML) เพื่อทำการเปลี่ยนแปลงองค์ประกอบ HTML กับคลาสที่ระบุ

สนับสนุนเบราว์เซอร์

คุณลักษณะ
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"> นี้จะช่วยให้คุณสามารถรวมคลาส CSS หลายองค์ประกอบหนึ่ง HTML กฎการตั้งชื่อ: จะต้องเริ่มต้นด้วยตัวอักษร AZ หรือ az สามารถตามตัวอักษร (A-Za-z) , ตัวเลข (0-9) , ยัติภังค์ ("-") และขีดล่าง ("_") ใน HTML, ค่าทั้งหมดเป็นกรณีตาย

ความคุ้มค่า

ลักษณะ

classname

ระบุหนึ่งหรือมากกว่าหนึ่งชื่อชั้นสำหรับองค์ประกอบ เพื่อระบุหลายชั้นเรียนแยกชื่อชั้นที่มีพื้นที่เช่น <span class="left important"> นี้จะช่วยให้คุณสามารถรวมคลาส CSS หลายองค์ประกอบหนึ่ง HTML

กฎการตั้งชื่อ:

จะต้องเริ่มต้นด้วยตัวอักษร AZ หรือ az
สามารถตามตัวอักษร (A-Za-z) , ตัวเลข (0-9) , ยัติภังค์ ("-") และขีดล่าง ("_")
ใน HTML, ค่าทั้งหมดเป็นกรณีตาย

ตัวอย่างเพิ่มเติม

ตัวอย่าง

เพิ่มชั้นเรียนหลายองค์ประกอบ 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>

ลองตัวเอง»