'xmlns'및 'version'과 같은 SVG 매개 변수가 필요합니까?

203

인터넷에서 볼 수있는 svg 예제의 약 절반에서 코드는 간단한 단순 <svg></svg>태그로 싸여 있습니다.

다른 반쪽에서 svg 태그에는 다음과 같은 복잡한 속성이 많이 있습니다.

<svg 
  xmlns="http://www.w3.org/2000/svg" 
  version="1.1" 
  xmlns:xlink="http://www.w3.org/1999/xlink">

내 질문은 : 간단한 svg 태그를 사용해도 괜찮습니까? 나는 복잡한 것들을 가지고 놀았고, 그것들을 포함시키지 않으면 모든 것이 잘 끝납니다.

xml svg tags

— 라스
소스

206

모든 사용자 에이전트 (브라우저)는 버전 속성을 무시하므로 언제든지 삭제할 수 있습니다.

SVG 인라인을 HTML 페이지에 임베드하고 해당 페이지를 그대로 제공 text/html하면 xmlns 속성이 필요하지 않습니다 . HTML 문서에 SVG 인라인을 포함시키는 것은 HTML5의 일부로 등장한 상당히 최근의 혁신입니다.

그러나 페이지를 image / svg + xml 또는 application / xhtml + xml 또는 사용자 에이전트가 XML 파서를 사용하게하는 다른 MIME 유형으로 제공하는 경우 xmlns 속성 이 필요합니다 . 이것은 최근까지만 할 수있는 유일한 방법이므로 이와 같은 많은 콘텐츠가 제공됩니다.

— 로버트 롱슨
소스

5

"모든 UA는 버전 속성을 무시하므로 언제든지 삭제할 수 있습니다." -그러나 스펙은 그 문제에 대해 무엇을 말해야합니까? "브라우저를 사용하면 문제를 해결할 수 있습니다."는 모호하지 않은 많은 관행에 해당됩니다.

— Mark Amery

IE11에서는 <!DOCTYPE svg xmlns="www.w3.org/2000/svg">작동하지만 xmlns를 제거하거나 변경하면 <!DOCTYPE svg xmlns="www.example.com">작동하지 않습니다. 왜 그런 겁니까?

— Donald Duck

8

이 답변에 출처를 인용 할 수 있습니까?

— 2540625

69

Firefox에서 SVG 코드의 상당 부분을 작성했으며 그렇게 말합니다. 충분하지 않습니까? 그렇지 않다면 어쨌든 몇 가지 링크를 추가했습니다.

— Robert Longson

1

@Marcel 해당 데이터 URI가 image / svg + xml 인 경우가 아닙니다. 일반적으로이 경우 대답의 마지막 부분이 유지됩니다.

— Robert Longson

228

xmlns="http://www.w3.org/2000/svg"속성은 다음과 같습니다

필요 에 대한 이미지 / SVG + XML의 파일입니다. ¹
인라인 옵션 입니다 <svg>. ²

xmlns:xlink="http://www.w3.org/1999/xlink"속성은 다음과 같습니다

필요 에 대한 이미지 / SVG + XML을 가진 파일 인 XLink : 속성. ¹
옵션 에 대한 인라인 <svg> 으로 되는 XLink : 속성. ²

version="1.1"속성은 다음과 같습니다

권장 사항 을 준수하는 이미지 / SVG + XML의 파일을 표준. ^삼
모든 사용자 에이전트에 의해 무시 됩니다. ⁴
SVG 2에서 제거 되었습니다. ⁵

¹ 국제화 된 자원 식별자 (RFC3987)
² HTML5 이후
³ XML (Extensible Markup Language) 1.0
⁴ 추가 메이저 버전이 출시 될 때까지.
⁵ SVG 2, W3C 후보 추천, 2018 년 8 월 7 일

— n 컴퓨터
소스

2

http가되어야합니까 아니면 https가되어야합니까?

— JohannesB

2

@JohannesB 두 프로토콜 모두 호환됩니다 : D

— ncomputers

1

예 여기 @JohannesB 당신은이 인라인 예를 들어 HTTP HTTPS 및 이미지 / SVG + XML을 가진 파일을 인라인 으로 SVG 되는 XLink는 예를 들어 속성 HTTP HTTPS

— ncomputers에게

1

감사합니다. Nick Craver도 실수를 저지른 것 같습니다.)

— JohannesB

2

versionxml 선언 ( <?xml version...)의 version속성을 <svg>요소 의 속성으로 착각하지 마십시오 . 첫 번째는 XML 마크 업 언어의 버전에 관한 것이고 후자는 SVG의 버전을 지정합니다. 이 답변의 저자는 ³의 SVG 사양이 아닌 XML을 참조하여 실수를 범했습니다. 나는 그것을 고치려고 노력했지만 일부 바보들은 편집을 거부했다.

— Bachsau

7

두 답변에 모두 추가하고 싶지만 포인트가 없으며 새로운 답변을 추가하고 있습니다. Chrome (버전 63.0.3239.132 (공식 빌드) (64 비트 Windows))에 대한 최근 테스트에서 다음을 발견했습니다.

텍스트 편집기 나 javascript 및 elm.innerHTML을 통해 HTML 파일에 직접 입력 된 인라인 SVG의 경우 다른 두 가지 답변에서 설명한대로 xmlns 속성이 필요하지 않습니다.
그러나 자바 스크립트와 AJAX를 통해로드되는 인라인 SVG에는 두 가지 옵션이 있습니다.
- xhr.responseText및을 사용하십시오 elm.innerHTML. xmlns가 필요하지 않습니다.
- 사용 xhr.responseXML.documentElement및 elm.appendChild()나 elm.insertBefore(). 인라인 SVG를 생성하는이 방법은에서와 같이 기본 SVG 네임 스페이스를 선언하지 않고 반 베이크 결과를 생성합니다 xmlns="http://www.w3.org/2000/svg". <svg>는 HTML로로드되지만 getElementById()<svg> 요소에서 인식되지 않는 등의 문서 수준 함수 입니다. HTML 외부에서 XMLHttpRequest XML 파서를 사용하기 때문이라고 가정합니다.

— 제임스
소스

0

MDN WebDoc 은 SVG 버전 속성에 대해

SVG 2부터 사용되지 않음
이 기능은 더 이상 권장되지 않습니다. 일부 브라우저는 여전히이를 지원할 수 있지만 관련 웹 표준에서 이미 제거되었거나 삭제 중이거나 호환성 목적으로 만 유지 될 수 있습니다. 사용하지 말고 가능한 경우 기존 코드를 업데이트하십시오. 결정을 안내하려면이 페이지 하단의 호환성 표를 참조하십시오. 이 기능은 언제든지 작동하지 않을 수 있습니다.

version 속성은 SVG 문서가 준수하는 사양을 나타내는 데 사용됩니다. 루트 요소에서만 허용됩니다. 이는 순전히 자문이며 렌더링 또는 처리에 영향을 미치지 않습니다.

추신 : SVG 2는 아직 표준이 아닙니다.

— 벨 루사 미 벨루
소스