Code
<div style="border: 1px solid red; padding: 10px;"> Bài viết </div>Tùy biến:
Chúng ta có thể tùy biến các thuộc tính của dòng code này:
<div style="border: 1px solid red; padding: 10px;">Ở đây:
border:Đường viền có 3 thông số lần lượt là:
1-Độ dầy đường viền
2-Kiểu đường viền
3-Màu đường viền
-Độ dày đường viền: thường 1px là vừa.
-Kiểu đường viền: thường dùng là Solid(đường liền), ta có thể thay đổi bằng các thuộc tính sau: dotted, dashed, double, groove, ridge, inset và outset
-Màu đường viền: có thể sử dụng các màu chuẩn như: white, red, black, lime, yellow, orange, aqua ... hoặc sử dụng mã màu hex code
Padding: Cần thiết để nội dung khỏi tràn đụng vào khung, có thể thay đổi các giá trị từ 0 đến 10px.
Các thuộc tính cách nhau dấu Chấm Phẩy
Ngoài ra, ta có thể tùy biến thêm bằng cách đưa vào một số thuộc tính định dạng văn bản trong khung như:
Background-color: Màu nền trong khung
Color: Màu chữ trong khung, VD: color: orange; hoặc color: #6acfff;
Text-align: Canh lề bài viết, có thể: left, center hay right.
Margin:Căn vị trí của khung
Ví dụ:
<div style="Background-color: #FFFFFF; border: 1px solid orange; color: aqua; margin: 10px 0; padding: 10px; text-align: center;"> Bài viết </div>Tham khảo thêm ở ĐÂY sẽ chi tiết hơn.