Khối phần tử so với phần tử nội tuyến trong HTML: tại sao phân biệt?

Sự khác biệt giữa các yếu tố khối và nội tuyến luôn có vẻ xa lạ đối với tôi. Sự khác biệt hoàn toàn là một phần tử khối chiếm toàn bộ chiều rộng, do đó buộc ngắt dòng trước và sau phần tử và một phần tử nội tuyến chỉ chiếm nhiều như nội dung. Tại sao không chỉ có một loại phần tử - một phần tử nội tuyến nơi bạn cũng có thể áp dụng chiều cao / chiều rộng tùy chỉnh và sử dụng phần tử đó? Bạn muốn ngắt dòng? Chèn một <br />hoặc có thể thêm một thẻ đặc biệt trong CSS cho hành vi đó. Theo cách hiện tại, tôi không thấy nó giải quyết bất kỳ vấn đề nào, và thay vào đó, nó chỉ buộc một tài sản mà theo tôi nên được quyết định bởi một nhà thiết kế.

Vậy tại sao hai loại?

Bạn nói:

Bạn muốn ngắt dòng? Chèn một <br />hoặc có thể thêm một thẻ đặc biệt trong CSS cho hành vi đó. Theo cách hiện tại, tôi không thấy nó giải quyết bất kỳ vấn đề nào, và thay vào đó, nó chỉ buộc một tài sản mà theo tôi nên được quyết định bởi một nhà thiết kế.

Bạn đang đi đúng hướng - phong cách nên được quyết định bởi nhà thiết kế.

Nhưng, bạn đã có vấn đề theo cách khác. Chèn <br/>thẻ thực sự là tùy chọn "buộc một thuộc tính do nhà thiết kế quyết định" - bên trong tài liệu đánh dấu, một khi đã <br/>có, nó chỉ ở đó - và chỉ với một số CSS khó khăn / hacky, bạn mới có thể loại bỏ hiệu ứng của nó.

elementsMặt khác, nội tuyến / khối là các yếu tố hoàn toàn được tạo kiểu với mặc định thuận tiện cho trường hợp sử dụng chung. Bản thân thuộc tính trực quan có thể được thay đổi ngay lập tức bởi một nhà thiết kế CSS có display:inlinehoặc display:block.

Lấy ví dụ như yếu tố phổ biến để điều hướng những ngày này - <li>. Đây là blockcác yếu tố mặc định , nhưng các nhà thiết kế sẽ làm cho chúng floatxuất hiện nội tuyến ( blockcó nhiều thuộc tính đặc biệt hơn là chỉ chiếm toàn bộ dòng, nhưng đó là một cuộc trò chuyện cho một ngày khác).

Hầu hết các yếu tố có định dạng chuẩn ... Câu hỏi của bạn có thể được mở rộng để nói định dạng này cũng phải là quyết định của người thiết kế và nên được xóa. Tôi luôn chỉ hình dung đó là điểm khởi đầu và xóa định dạng nếu cần (thường là không). Nhưng cuối cùng, có một số điều tự nhiên. Nếu bạn có một đoạn văn chẳng hạn, bạn mong đợi nó là một phần tử khối vì đó là bản chất của một đoạn văn. Bất kể các phần tử có cài đặt mặc định hay không, chẳng hạn như khối hoặc nội tuyến, tôi chắc chắn sẽ muốn khả năng chỉ định tùy chọn này. Lý do tôi nói điều này là IMO sạch hơn để phá vỡ mọi thứ theo cách này so với ném<br />trong HTML. Liệu nó có làm điều tương tự? Đúng. Nhưng với những tiến bộ gần đây trong HTML, một nỗ lực lớn đã tập trung vào việc biến nó thành ngôn ngữ ngữ nghĩa mà bạn đặt ít hơn vào HTML theo định dạng và nhiều hơn trong CSS. Các <br />phá vỡ phương tiện đường mà thường được đề cập đến một ngắt dòng trong một đoạn văn hoặc cấu trúc câu chứa khác. Cuối cùng, điều đó không thành vấn đề với tôi nhưng cá nhân tôi muốn có khả năng phân biệt khối và nội tuyến vì vậy tôi hy vọng họ sẽ không bao giờ loại bỏ điều đó khỏi phía CSS ít nhất!

Đây là loại giống như nói rằng không có sự khác biệt thực sự giữa các đoạn và câu. Đoạn văn phân định một nhóm ý tưởng. Thông thường, một câu là cho một ý tưởng duy nhất.

Đánh dấu là về ngữ nghĩa, không hiển thị. Thật vậy, một nhà thiết kế có thể tự do coi bất kỳ yếu tố nào mặc định theo kiểu khối là nội tuyến và ngược lại.

Trong LaTeX , có hai chế độ (không bao gồm chế độ toán học): chế độ ngang và chế độ dọc. Các yếu tố (ký tự) là các hộp nhỏ tích lũy "theo chiều ngang" trong đoạn văn. Sau đó, các hộp lớn hơn tích lũy theo chiều dọc. Điều này tương tự với (X) HTML: nội tuyến và khối.

Âm thanh như một vấn đề tương thích ngược với tôi. Yếu tố nội tuyến có lẽ là một bổ sung sau này cho tiêu chuẩn HTML và do đó, các trang web được viết vào năm 1992 vẫn có thể được xem vào năm 2011, nó vẫn được hỗ trợ - giống như có rất nhiều trang web 19 tuổi ngoài kia ...!

Tôi nghĩ rằng các chế độ hiển thị rất khác nhau giữa khối và nội tuyến, đó là một sự khác biệt đáng để thực hiện ở cấp độ đánh dấu.