1) Chức năng của thuộc tính style
– Chức năng của thuộc tính style là dùng để thiết lập việc định dạng cho một phần tử HTML.
– Tôi thiết lập cho phần tử <p> có chữ màu đỏ, kích cỡ chữ 75 pixel, phông chữ cursive
<!DOCTYPE html>
<html>
<head>
<title>Xem ví dụ</title>
<meta charset="utf-8">
</head>
<body>
<p style="color:red;font-size:75px;font-family:cursive">Hello</p>
</body>
</html>Xem ví dụ
2) Cách sử dụng thuộc tính style
– Để sử dụng thuộc tính style thì chúng ta đặt nó vào bên trong thẻ mở của phần tử mà mình muốn định dạng với cú pháp như sau:
style="property:value"– Trong đó:
| Property | – Là một thuộc tính CSS dùng để đại diện cho đặc điểm (kiểu dáng) mà bạn muốn định dạng cho phần tử, ví dụ như:
|
| Value | – Là giá trị mà các bạn muốn gán cho thuộc tính CSS, ví dụ như:
|
– Thiết lập chữ màu đỏ cho phần tử <h1>
<!DOCTYPE html>
<html>
<head>
<title>Xem ví dụ</title>
<meta charset="utf-8">
</head>
<body>
<h1 style="color:red">Hello</h1>
</body>
</html>Xem ví dụ
– Lưu ý: Để thiết lập nhiều thuộc tính CSS cho một phần tử thì chúng ta đặt nhiều cặp property:value bên trong giá trị của thuộc tính style. Tuy nhiên, các bạn cần phải nhớ thêm một dấu chấm phẩy ngăn cách giữa các cặp property:value
<!DOCTYPE html>
<html>
<head>
<title>Xem ví dụ</title>
<meta charset="utf-8">
</head>
<body>
<p style="font-family:cursive;font-size:55px;color:violet">Hello</p>
</body>
</html>Xem ví dụ
3) Chuyển sang tham khảo bộ tài liệu học CSS
– Việc định dạng cho một phần tử chủ yếu là nhờ vào CSS, thuộc tính style chỉ là phương tiện trung gian để áp dụng CSS lên phần tử mà thôi. Sau bài học này, các bạn nên tham khảo song song ngôn ngữ HTML cùng với bộ tài liệu hướng dẫn học CSS để hiểu rõ hơn về cách thức định dạng cho phần tử.
