Câu trả lời:
Sự khác biệt chính là <span>
thẻ là một yếu tố nội tuyến , trong khi <div>
thẻ là một yếu tố cấp khối .
Hai phần tử mức khối (div) sẽ được hiển thị lần lượt theo chiều dọc, trong khi hai phần tử nội tuyến (nhịp) sẽ được hiển thị lần lượt theo chiều ngang.
Để hiểu sự khác biệt về thuật ngữ trực quan, có thể giúp nghĩ về <span>
yếu tố này như một từ và <div>
yếu tố như một đoạn văn: div thường được sử dụng để bố trí các khối nội dung. Các nhịp thường được sử dụng để làm nổi bật các nhóm từ trong nội dung đó.
Cả Nick và Toby đều đã trả lời câu hỏi của bạn một cách độc đáo, nhưng để đưa nó lên một cấp độ nữa.
Theo mặc định, <div>
s là các phần tử khối và <span>
s là các phần tử nội tuyến. Đây là những thẻ chung đơn giản cung cấp khối hoặc khối chứa nội tuyến. Trong thực tế, những cái này có thể được xoắn thông qua CSS để có thể thay thế cho nhau bằng cách đặt thuộc tính css hiển thị thành 'block', 'inline' hoặc thậm chí là 'inline-block' (trong số những thứ khác).
Tuy nhiên, uốn cong chúng để hành động như nhau không được khuyến khích. Và, có các quy tắc trong HTML thực sự ngăn chặn việc sử dụng các yếu tố cấp khối bên trong các yếu tố khác (chủ yếu là các yếu tố nội tuyến như <a>
thẻ), vì vậy, bạn nên cố gắng sử dụng đúng thẻ khi phù hợp và chỉ cố gắng ghi đè hành vi của chúng khi hoàn toàn cần thiết.
Hãy thử nghĩ về chúng như các yếu tố ngữ nghĩa. <span>
Ví dụ, sử dụng khi bạn muốn gắn thẻ nội dung được sử dụng bên trong các khối văn bản và sử dụng <div>
khi bạn cần thêm cấu trúc bổ sung vào chính trang đó.
Đã nói điều này, HTML5 có rất nhiều yếu tố ngữ nghĩa sẽ làm giảm đáng kể nhu cầu sử dụng một trong hai thẻ chung này. Sử dụng các thẻ ngữ nghĩa được khuyến khích cao hơn việc thêm số lượng lớn các div và nhịp.
Chúc may mắn!
Sự khác biệt chính là divs
các yếu tố khối và spans
là các yếu tố nội tuyến.
Cả hai có thể được tạo kiểu bằng CSS để hành động theo cách bạn muốn nhưng ngoài hộp bạn thường sử dụng spans
cho các phân chia nội tuyến nhỏ hơn và divs
cho các khối lớn hơn.
Một số thứ sẽ ảnh hưởng đến các phần tử nội tuyến và khối khác nhau, ví dụ: bạn không thể đặt chiều cao lên một span
phần tử.