Sublime Text
<!DOCTYPE html> <html> <head> <style type="text/css"> .div1{ border: 10px solid black; width: 300px; } .div2{ border: 10px solid red; width: 300px; padding: 30px; margin: 20px; } .div3{ border: 1px solid blue; width: 50%; height:100px; } </style> </head> <body> <div class="div1">Phần tử này được thiết lập chiều rộng 300px, đường viền 10px (2 bên là 20px). Tổng chiều rộng của phần tử này là 320px</div> <div class="div2">Phần tử này được thiết lập chiều rộng 300px, đường viền 10px (2 bên là 20px), padding 30px (2 bên là 60px), margin 20px (2 bên là 40px). Tổng chiều rộng của phần tử này là 420px</div> <div class="div3"></div> </body> </html>
<!DOCTYPE html> <html> <head> <style type="text/css"> .div1{ border: 10px solid black; width: 300px; } .div2{ border: 10px solid red; width: 300px; padding: 30px; margin: 20px; } .div3{ border: 1px solid blue; width: 50%; height:100px; } </style> </head> <body> <div class="div1">Phần tử này được thiết lập chiều rộng 300px, đường viền 10px (2 bên là 20px). Tổng chiều rộng của phần tử này là 320px</div> <div class="div2">Phần tử này được thiết lập chiều rộng 300px, đường viền 10px (2 bên là 20px), padding 30px (2 bên là 60px), margin 20px (2 bên là 40px). Tổng chiều rộng của phần tử này là 420px</div> <div class="div3"></div> </body> </html>