Đóng các thẻ SVG, rõ ràng hoặc tự đóng?

Question

Tôi đã xác thực mã của mình và nhận được lỗi sau Tag cannot be self-closing. Use an explicit closing tag. trong IE cho đường dẫn svg của tôi vì nó tự đóng.

<pathd="m53.911,10.023c-1.46-.898-3.195-1.019-4.699-1.019h-3.439c"/>

Bây giờ tôi biết các thẻ meta trong HTML5 không yêu cầu dấu gạch ngang phía trước /, bạn chỉ cần đóng chúng với >. Điều tương tự có áp dụng với thẻ svg không? Cũng giống như vậy:

<pathd="m53.911,10.023c-1.46-.898-3.195-1.019-4.699-1.019h-3.439c">

Hoặc ... Sử dụng một thẻ đóng rõ ràng? Cũng giống như vậy:

<pathd="m53.911,10.023c-1.46-.898-3.195-1.019-4.699-1.019h-3.439c"></path>

đúng cách đóng một con đường là gì?

Answer 1

Bất kỳ xác thực nào bạn đang sử dụng đều hoạt động không chính xác.

SVG and MathML tags are self closing within HTML if they end with />. I E. Bạn có thể viết một con đường như <path></path> hoặc <path/> nhưng bạn không thể viết nó như <path>

Answer 2

The answer by Robert Longson là rất tốt, nhưng liên kết đến a document that is marked như:

Tài liệu này đã hết hiệu lực và chỉ được làm sẵn có cho lịch sử mục đích.

---

tôi muốn tìm thấy một số cập nhật lên đặc điểm kỹ thuật về hành vi này, và đây là những gì tôi thấy:

Một Tự thẻ đóng là một hình thức đặc biệt của bắt đầu thẻ với dấu gạch chéo ngay trước khung góc bên phải đóng. Điều này cho biết rằng phần tử sẽ được đóng ngay lập tức và không có nội dung. Khi cho phép và sử dụng cú pháp này, phải bỏ qua thẻ kết thúc . Trong HTML, việc sử dụng cú pháp này bị giới hạn ở các yếu tố void void và các yếu tố nước ngoài. Nếu nó được sử dụng cho các yếu tố khác, nó được coi là một thẻ bắt đầu.

Nguồn: W3C HTML5 Reference Editor's Draft

thẻ Bắt đầu phải có định dạng sau:

...

6. Sau đó, nếu phần tử là một trong những của các yếu tố void void hoặc nếu phần tử là một yếu tố nước ngoài , sau đó có thể có một ký tự U + 002F SOLIDUS đơn (/). Ký tự này không ảnh hưởng đến các phần tử void , nhưng trên các phần tử nước ngoài nó sẽ đánh dấu thẻ bắt đầu là tự đóng.

Nguồn: HTML Living Standard from WHATWG và HTML: The Living Standard - A technical specification for Web developers

Inline SVG và MathML hỗ trợ

...

Cú pháp <foo/> sẽ mở ra và ngay lập tức đóng cửa các yếu tố foo nếu nó là một MathML hoặc Phần tử SVG (nghĩa là không phải là phần tử HTML).

Nguồn: HTML5 Parser at Mozilla Developer Network

---

Kết luận: Điều gì Robert longson đã viết trong his answer vẫn là hợp lệ. Cảnh báo này trong các công cụ phát triển IE11 là sai. Sử dụng cú pháp tự đóng trong HTML5 là hợp lệ (nhưng chỉ dành cho các yếu tố void void, chẳng hạn như <br/>; hoặc các yếu tố nước ngoài, là các yếu tố từ MathML và SVG).