CSS3中的data屬性是一種很有用的方式，可以將一些元素與數據相關聯。data屬性的語法是"data-xxxx"，其中xxxx可以是自定義的名稱，用于存儲與元素相關的數據。可以在CSS樣式表中使用選擇器[data-xxxx]選擇所有所有具有該屬性的元素，并為其設置樣式。

[data-user-name] {
font-weight: bold;
}

在HTML中，可以使用JavaScript來設置data屬性的值。例如，以下代碼將為id為"person"的元素設置data-"name"和data-"age"屬性：

var person = document.getElementById("person");
person.dataset.name = "John";
person.dataset.age = 30;

然后可以使用CSS選擇器來選擇所有具有特定數據屬性的元素，并根據數據屬性設置不同的樣式。例如，以下代碼將使用相同的樣式顯示所有具有data-"name"屬性的元素：

[data-name] {
color: blue;
}

可以使用JavaScript來獲取已設置的data屬性，例如：

var person = document.getElementById("person");
var name = person.dataset.name;
var age = person.dataset.age;

data屬性還有其他很多用途，例如可以使用它們來存儲選擇器需要使用的圖像路徑、元素的狀態、元素的文本等等。該屬性為開發人員提供了一種簡單的方法，可以讓他們將元素與適當的數據關聯起來，以便更輕松地操作網頁中的內容。