Danh sách tổ trong các đoạn văn trong html

Question

Dường như (nghiêm ngặt) html không cho phép lồng các phần tử không nội tuyến bên trong <p>, nhưng sau đó làm cách nào để hiển thị đoạn có chứa danh sách văn bản tự nhiên). Tôi đã nhìn thấy ba câu trả lời mà tất cả dường như không hài lòng:

• Danh sách không nên xảy ra bên trong đoạn văn. (Tôi sẽ không đi vào một cuộc tranh luận văn hóa, nhưng tôi chắc chắn hy vọng rằng html sẽ không trở thành nơi để đọc viết phong cách.)
• Phân tách văn bản thành một đoạn, sau đó một danh sách, và sau đó là một giây đoạn với văn bản sau. Điều này có vẻ xấu bởi vì bây giờ tôi có các khối <p> là các phần của các đoạn và điều đó có vẻ không tốt đối với đánh dấu đang cố di chuyển theo hướng ngữ nghĩa hơn.
• Đoạn giả sử dụng một số <div class="mypara"> - trông giống như một cách xấu để bỏ qua toàn bộ nội dung và bỏ qua việc sử dụng đánh dấu với ngữ nghĩa phù hợp cho văn bản.

Có cách nào khác để thực hiện điều này đúng ngữ pháp và hợp lệ không?

Answer 1

Đoạn trong HTML 5, kể từ bản nháp làm việc mới nhất, được định nghĩa là các phần tử luồng chỉ có thể chứa các phần tử tạo phrasing. Các danh sách cũng được định nghĩa là các phần tử luồng và có thể không được kèm theo trong các đoạn văn. Dù bạn cho rằng định nghĩa của đoạn văn phải là gì, đây là định nghĩa chính thức của thuật ngữ trong HTML, và tôi nghĩ rằng nó không có khả năng thay đổi.

Có hai khả năng mà bạn có thể xem xét bên cạnh hai bạn đã đề cập:

• Hãy cân nhắc cho một yếu tố dòng chảy rộng đạt hơn đoạn nếu nó được áp dụng, chẳng hạn như section, nav, header, footer hoặc article.
• Sử dụng phương pháp kết hợp: bọc chuỗi p – ol – p với số div lựa chọn của bạn áp dụng định dạng chung cho bộ này.

As far as div đi, spec HTML 5 rõ ràng khuyến cáo rằng nó phải là một yếu tố "phương sách cuối cùng" bởi vì nó không chịu nghĩa ngữ nghĩa trong cách mà các phần tử HTML khác làm, và có thể không được như thân thiện với người dùng trong các tác nhân người dùng thay thế. Đi theo lời khuyên này, tôi sẽ không sử dụng div với chi phí p cho văn bản nội dung nếu ngữ nghĩa quan trọng đối với bạn. Tuy nhiên, nó có thể hữu ích trong việc đảm bảo rằng việc sử dụng nhiều đoạn văn không bị quá trực quan.

Answer 2

Tôi không nghĩ rằng thẻ html <p> có nghĩa là để kiểm soát các thành ngữ của phong cách viết thực tế. Nó là một cách để hiển thị một đoạn văn bản một cách có trật tự. Tôi không tin rằng nó có nghĩa là để mô phỏng tài liệu in. Bạn sẽ phải sử dụng một Div cho cái này.

Answer 3

Câu trả lời cho câu hỏi của bạn rõ ràng là không, bởi vì các thông số kỹ thuật cho biết bạn không thể làm điều đó. Giống như bạn, tôi muốn duy trì ngữ nghĩa, vì vậy tôi thường đi với tùy chọn thứ 2 của bạn (đoạn văn, danh sách, một đoạn khác). Tuy nhiên, ngoài đỉnh đầu của tôi, tôi không thể nghĩ ra bất kỳ văn bản nào mà danh sách không thực sự phá vỡ luồng văn bản, vì vậy dường như bắt đầu một đoạn văn mới sau khi danh sách không bị tổn thương.

Answer 4

Tôi cho rằng nó phụ thuộc vào những gì bạn cho là một "đoạn". Rõ ràng với tôi rằng các nhà thiết kế HTML không hề coi danh sách là một phần của một đoạn văn.Và trong khi tôi nghĩ rằng một lập luận có thể được thực hiện cho một trong hai giải thích, tôi là ý kiến ​​cho rằng spec là chính xác.

Trong khi danh sách không đại diện cho suy nghĩ theo dòng suy nghĩ, nó chắc chắn đại diện cho sự thay đổi về giọng nói hoặc phương pháp suy nghĩ, điều tôi tin tưởng xứng đáng là một container ngữ nghĩa mới.

Trong cùng một dòng, đoạn văn đại diện cho một phân vùng hợp lý trong một đoạn văn bản. Danh sách đại diện cho một chuỗi các phân vùng hợp lý, và trong khi có thể tưởng tượng rằng một phân vùng hợp lý có thể được chia thành nhiều phân vùng hơn, nó có ý nghĩa hơn khi tạo một phân vùng mới (đặc biệt là một khoảng ngắt lớn trong giọng nói/phương pháp).

Ngữ nghĩa học có thể chủ yếu là chủ quan. Và đó là tốt. Tuy nhiên, trong trường hợp này, tôi có ý kiến ​​rằng thông số HTML thể hiện chính xác ngữ nghĩa.

Answer 5

Có lý do kiểu trực quan nào đằng sau tất cả điều này không? Nói cách khác khi bạn có một cái gì đó như sau, là nó trực quan rendering theo một cách mà bạn không tìm thấy lý tưởng?

<p>Some paragraph text.</p> 
<ul> 
    <li>First list item</li> 
    <li>Second list item</li> 
    <li>Third list item</li> 
</ul> 
<p>Another paragraph.</p> 

Nếu vấn đề là quá nhiêu lợi nhuận sau khi P và trước khi UL, sau đó bạn có thể thử một anh chị em chọn liền kề như thế này để bù đắp:

p + ul { margin-top: -1em; }