Vì vậy, tôi đọc rằng <html> và <body> là các yếu tố cấp khối, giống như <div> và <p>.<HTML> và <BODY>: Tại sao không có dòng mới?
Tôi hiểu rằng các yếu tố cấp khối sẽ bắt đầu một dòng mới.
Ví dụ aaa<div>b</div>ccc trông như thế này:
aaa
b
ccc
Vì vậy, tại sao không <html> và <body> thêm hai dòng để phía trên cùng của trang html của bạn?
Yếu tố cấp khối không "bắt đầu dòng mới" ... chúng đơn giản mở rộng cho cả hai bên vô thời hạn cho đến khi nhấn thành phần vùng chứa hoặc các cạnh của màn hình (width:100%) ... vì điều này, chúng có ảnh hưởng của việc "đẩy" bất kỳ nội dung nào khác xuống dưới chúng hoặc giảm xuống dưới bất kỳ nội dung nội tuyến nào ngay trước chúng. Nó cũng có nghĩa là các phần tử mức khối sẽ chỉ "đẩy xuống" các phần tử cấp độ anh chị em.
<html> và <body> các yếu tố không có anh chị em, chỉ có trẻ em, vì vậy chúng không cần phải thay thế bất cứ điều gì.
Dưới đây là một đại diện đồ họa của những gì đang xảy ra: 
Với dấu sau:
<html>
<head></head>
<body>
<div> </div>
<div> </div>
<div style='width:45%; float:left;'>
<div> </div>
</div>
<div style='width:45%; float:left;'> </div>
</div>
</body>
</html>
+1 cho đại diện đồ họa! :) – SuperSaiyan
Đồ họa đẹp! (nhiều ký tự) –
Câu trả lời thú vị. Cảm ơn tôi nghĩ bây giờ tôi đã hiểu. Vì vậy, theo mặc định, các yếu tố mức khối được đặt thành 100% chiều rộng, đó là lý do tại sao chúng tự đẩy mình và mọi thứ sau đó, giảm? trừ khi bạn thay đổi độ rộng? – Lebowski156
Hãy suy nghĩ về nó theo cách này:
<div>
<div>Text</div>
</div>
Chỉ có một dòng văn bản:
chữ
này cũng giống như trường hợp khi bạn có bất kỳ văn bản trong cơ thể:
<html>
<body>Text</body>
</html>
Khi văn bản là trong phần tử con, không có dòng mới được giới thiệu.
Chúng là các yếu tố chặn xác định trang. Trình duyệt kiểm soát cách họ muốn xem. Bạn có thể tìm thấy một số trình duyệt khủng khiếp hiển thị số <body> bằng cách thêm dòng mới (có thể). Tuy nhiên, trọng tâm chính của bạn là xem xét các thẻ <body> và <html> dưới dạng thẻ hiển thị mọi thứ trên màn hình. Tôi cũng muốn nói thêm rằng bạn có thể sử dụng thẻ để phù hợp với màn hình trình duyệt hoàn toàn bằng cách sử dụng
body {padding:0;margin:0;}
Hope this helps.
Phần tử cấp khối theo mặc định (nghĩa là khi CSS không được sử dụng để thay đổi điều này) ngụ ý ngắt dòng trước và sau. Chúng không ngụ ý dòng trống.
Vì vậy, khi bạn có <div>foo</div>, thì “foo” xuất hiện ở đầu dòng mới và nó cũng có một dòng, tức là bất kỳ văn bản nào sau dòng trên dòng tiếp theo.Nhưng điều này không có nghĩa là tạo ra các dòng trống. Nếu bạn có <div>foo</div><div>bar</div>, thì “foo” và “bar” xuất hiện trên các dòng liên tiếp, không có dòng trống giữa chúng.
Phần tử html như vậy không tạo ra nội dung hiển thị; chỉ có phần tử body bên trong nó được hiển thị. Và nội dung body bắt đầu ở đầu trang, được tính là bắt đầu trên một dòng mới. Liệu có thẻ <body> hay không là không quan trọng; luôn có phần tử body, bắt đầu trên dòng đầu tiên.
"Phần tử html như vậy không tạo ra nội dung hiển thị, chỉ phần tử cơ thể bên trong nó được hiển thị." Xem http://jsfiddle.net/NxSm6/ – Alohci
Chúng chỉ đơn giản là xác định thẻ, chúng không thực sự đặt nội dung ở bất kỳ đâu. –