CSS Padding – Serie CSS – 8

Xin chào các bạn, chúng ta lại gặp nhau.
Mình xin giới thiệu các bạn đến thuộc tính css mới trong serie lần này.

CSS Padding

Thuộc tính Padding là khoảng cách được tính từ viền đến phần tử. Phần tử ở đây là nội dung của một thẻ không bao gồm thẻ.

Ví dụ: <p> Đây là nội dung của thẻ P </p>
thì đoạn loại trừ thẻ <p> </p> ra thì phần bên trong chính là nội dung.

Demo về padding:

Đây là phần tử. Phần padding được diễn tả bằng màu trắng. Phần Margin được diễn tả bằng màu đen. Phần Border là vách ngăn giữa Padding và Margin 

Lưu ý

Các bạn nên chú ý kỹ giữa padding và margin, vì nó có tác dụng gần giống nhau nhưng nếu dùng sai có thể dẫn đến tình trạng vỡ giao diện.

Padding cũng có cách dùng tương tự với Margin.

Cách dùng :

padding: <giá trị trên> <giá trị trái> <giá trị dưới> <giá trị phải> ;

Hoặc

padding: < giá trị trên-dưới> < giá trị trái-phải>;

Hoặc:

padding: <giá trị tổng hợp >

ví dụ: padding: 20px;

Dưới đây là tổng hợp thuộc tính của padding.