JSFiddle - React, Tailwind, and code Playground

by Tìm ở đây Khoá học CNTT

HTML

<h2>Minh hoạ mô hình hộp - Box Model</h2>

<p>Mô hình hộp CSS về cơ bản là một hộp bao quanh phần tử HTML. Nó bao gồm: đường viền, phần đệm, lề và nội dung thực tế.</p>

<div>Đây là đoạn văn bản nằm trong box. Chúng có phần đệm 50px, lè 20px và 15px là độ rộng đường viên xanh. Quan trọng: Khi bạn đặt thuộc tính chiều rộng và chiều cao của một phần tử bằng CSS, bạn chỉ cần đặt chiều rộng và chiều cao của vùng nội dung. Để tính kích thước đầy đủ của một phần tử, bạn phải cộng thêm phần đệm, đường viền và lề..</div>

CSS

div {
  background-color: lightgrey;
  width: 300px;
  border: 15px solid green;
  padding: 50px;
  margin: 20px;
}