Inline CSS

Tags

Status In progress
Inline CSS là gì?
ử ụ
Cách s d ng Inline CSS
Các thuộc tính CSS có thể sử dụng với Inline CSS
Ưu điểm và nhược điểm của Inline CSS
Ưu điểm:
Nhược điểm:
Khi nào nên sử dụng Inline CSS?
Kết luận

ạ ẽ ọ ề ộ
Xin chào các b n sinh viên, hôm nay chúng ta s h c v Inline CSS, m t cách đ ể
ị ể ẻ
đ nh ki u cho các th HTML tr c ti p. ự ế
Inline CSS là gì?
ộ ể ị ể ẻ ằ ử ụ ộ
Inline CSS là m t cách đ đ nh ki u cho các th HTML b ng cách s d ng thu c
ộ ể ượ ặ ẻ ởủ ấ ẻ
tính style . Thu c tính style có th đ c đ t bên trong th m c a b t kỳ th HTML
nào.
Ví d : ụ
HTML

<h1 style="color: red;">Tiêu đề</h1>

ẽạ ộ ề
Mã HTML này s t o ra m t tiêu đ có màu đ . ỏ
ử ụ
Cách s d ng Inline CSS
ểử ụ ạ ỉầ ộ
Đ s d ng Inline CSS, b n ch c n thêm thu c tính bên trong thẻ mở của thẻ
style

HTML bạn muốn định kiểu. Sau đó, bạn có thể đặt các thuộc tính CSS bên trong
thuộc tính . style

Ví dụ:
HTML

Inline CSS 1
 <h1 style="color: red; font-size: 20px;">Tiêu đề</h1>

ẽạ ộ ề ỏ
Mã HTML này s t o ra m t tiêu đ có màu đ và c ch 20px.ỡ ữ
ộ
Các thu c tính CSS có th s d ng v i Inline CSSể ử ụ ớ
ạ ểử ụ ấ ộ ớ
B n có th s d ng b t kỳ thu c tính CSS nào v i Inline CSS. D ưới đây là một số
ộ ổ ế ạ
thu c tính CSS ph bi n mà b n có th s d ng: ểử ụ
color : Định màu chữ

font-size : Định cỡ chữ

font-family : Định font chữ

text-align : Định căn lề chữ

background-color : Định màu nền

border-style : Định kiểu đường viền

border-width : Định độ dày đường viền

Ưu điểm và nhược điểm của Inline CSS

Ưu điểm:
ấ ơ ả ểử ụ
Inline CSS r t đ n gi n đ s d ng.

Inline CSS có thể được sử dụng để định kiểu cho các thẻ HTML riêng lẻ.

Nh ược điểm:
ể ệ ả ị ạ
Inline CSS có th gây khó khăn cho vi c qu n lý các đ nh d ng CSS.

Inline CSS có thể làm tăng kích thước của trang web.

ử ụ
Khi nào nên s d ng Inline CSS?
ộ ố ể ị ể ẻ ẻ ạ
Inline CSS là m t cách t t đ đ nh ki u cho các th HTML riêng l . Tuy nhiên, b n
ử ụ ẻ ượ ử ụ ặ ặ ạ
nên tránh s d ng Inline CSS cho các th HTML đ c s d ng l p đi l p l i. Trong
ườ ợ ạ ử ụ ặ
tr ng h p này, b n nên s d ng Internal CSS ho c External CSS.

ế ậ
K t lu n

Inline CSS 2
 ộ ơ ả ể ị ể ẻ ẻ
Inline CSS là m t cách đ n gi n đ đ nh ki u cho các th HTML riêng l . Tuy nhiên,
ạ ắ ử ụ ặ ẻ
b n nên cân nh c s d ng Internal CSS ho c External CSS cho các th HTML đ c ượ
ử ụ ặ ặ ạ
s d ng l p đi l p l i.

Inline CSS 3