Ví Dụ Về Thuộc Tính Margin - Học Web Chuẩn
Có thể bạn quan tâm
- Trang chủ
- Tham khảo
- CSS
- Ví dụ về thuộc tính margin
Thuộc tính margin-top
Thuộc tính margin-top : canh lề bên trên cho thành phần.
<html> <head> <style type="text/css"> div { border: 1px solid red; } p { background: #00CC00; margin-top: 10px; } </style> </head> <body> <div> <p>margin top</p> </div> </body> </html>margin top
Thuộc tính margin-right
Thuộc tính margin-right : canh lề bên phải cho thành phần.
<html> <head> <style type="text/css"> div { border: 1px solid red; } p { background: #00CC00; margin-right: 10px; } </style> </head> <body> <div> <p>margin right</p> </div> </body> </html>margin right
Thuộc tính margin-bottom
Thuộc tính margin-bottom : canh lề bên dưới cho thành phần.
<html> <head> <style type="text/css"> div { border: 1px solid red; } p { background: #00CC00; margin-bottom: 10px; } </style> </head> <body> <div> <p>margin bottom</p> </div> </body> </html>margin bottom
Thuộc tính margin-left
Thuộc tính margin-left : canh lề bên trái cho thành phần.
<html> <head> <style type="text/css"> div { border: 1px solid red; } p { background: #00CC00; margin-left: 10px; } </style> </head> <body> <div> <p>margin left</p> </div> </body> </html>margin left
Thuộc tính margin
Thuộc tính margin : canh lề cho thành phần, tổng hợp các thuộc tính margin-top, margin-right, margin-bottom, margin-left.
margin với giá trị 1 thành phần
<html> <head> <style type="text/css"> div { border: 1px solid red; } p { background: #00CC00; margin: 10px; } </style> </head> <body> <div> <p>margin 1 thành phần</p> </div> </body> </html>margin 1 thành phần
Trong đó: margin-top: 10px; margin-right: 10px; margin-bottom: 10px; margin-left: 10px;
margin với giá trị 2 thành phần
<html> <head> <style type="text/css"> div { border: 1px solid red; } p { background: #00CC00; margin: 10px 5px; } </style> </head> <body> <div> <p>margin 2 thành phần</p> </div> </body> </html>margin 2 thành phần
Trong đó: margin-top: 10px; margin-bottom: 10px; margin-left: 5px; margin-right: 5px;
margin với giá trị 3 thành phần
<html> <head> <style type="text/css"> div { border: 1px solid red; } p { background: #00CC00; margin: 5px 10px 0; } </style> </head> <body> <div> <p>margin 3 thành phần</p> </div> </body> </html>margin 3 thành phần
Trong đó: margin-top: 5px; margin-left: 10px; margin-right: 10px; margin-bottom: 0px;
margin với giá trị 4 thành phần
<html> <head> <style type="text/css"> div { border: 1px solid red; } p { background: #00CC00; margin: 5px 10px 10px 20px; } </style> </head> <body> <div> <p>margin 4 thành phần</p> </div> </body> </html>margin 4 thành phần
Trong đó: margin-top: 5px; margin-right: 10px; margin-bottom: 10px; margin-left: 20px;
Ví dụ thuộc tính margin
- margin-top
- margin-right
- margin-bottom
- margin-left
- margin
Từ khóa » Căn Lề Html
-
Căn Lề Trong HTML - Website Affiliate
-
Căn Lề Text-align Và Vertical-align Trong CSS
-
Căn Lề Trong Html
-
Canh Lề Cho Phần Tử Bằng Thuộc Tính Margin Trong CSS - Web Cơ Bản
-
Bài 8: Căn Lề Trong CSS | Tìm ở đây
-
Cách Căn Lề Form Trong Html - Tin Tức Công Nghệ, Sức Khỏe, Tử Vi
-
Hướng Dẫn Căn Lề Cho Ảnh Trong Html, Hình Ảnh Img Trong Html
-
Bài 4: Các Thẻ định Dạng Văn Thường Gặp Trong HTML
-
Cách Căn Chỉnh Form Trong Html, Căn Lề Text - Darkedeneurope
-
CSS Margin-left Property - W3Schools
-
Cách Căn Lề Trong Html - .vn
-
Canh Lề 2 Bên Cho đoạn Text Trong Html
-
Căn Lề (Margin) Trong CSS - Hoclaptrinh
-
Đâu Là Mã HTML Thực Hiện Căn Lề Trái Cho Nội Dung 1 ô Trong Bảng