문제

What is the correct way to insert a link tag that points to favicon? I've tried the following but the W3C Validator reports element "xhtml:link" undefined.

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:xhtml="http://www.w3.org/1999/xhtml">
  <title>De mægtige vikinger</title>
  <defs>
    <xhtml:link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
  </defs>
</svg>
도움이 되었습니까?

해결책 2

The validator isn't wrong per se, because what you have isn't pure svg, it's svg plus some xhtml and the validator has no such configuration. The way I see it you have two options:

  1. accept that this is how it is in browsers right now, and create a new validation profile / custom DTD for this use-case.
  2. pass the svg off as html5 instead, by changing the markup and removing the xml header and setting <!DOCTYPE html>. Then you can put the link as usual in the head section. Note that this may mean you won't be able to reference the file as an svg (since it's then html), so be sure to test in all browsers you target.

다른 팁

From the An XHTML + MathML + SVG Profile Specification

Only MathML and XLink namespace declarations are allowed on MathML elements, and XHTML or SVG namespaces cannot be declared.

So in essence, @ErikDahlström is right about a new validation profile. However, one in the public domain already exist. http://www.w3.org/2002/04/xhtml-math-svg/xhtml-math-svg.dtd It is missing the XLINK definition through, but we can easily add it.

The solution is rather wordy but that's the nature of XML.

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE svg PUBLIC
    "-//W3C//DTD XHTML 1.1 plus MathML 2.0 plus SVG 1.1//EN"
    "http://www.w3.org/2002/04/xhtml-math-svg/xhtml-math-svg.dtd"[
<!ENTITY % XLINK.xmlns "http://www.w3.org/1999/xlink" >
<!ENTITY % SVG.prefixed "IGNORE" >
<!ENTITY % XHTML.prefixed "INCLUDE" >
<!ENTITY % XHTML.prefix "xhtml" >
<!ENTITY % MATHML.module "IGNORE" >
]>
<svg version="1.1" id="denmark" viewBox="0 0 1280 800" preserveAspectRatio="xMidYMid slice"
    xmlns="http://www.w3.org/2000/svg"
    xmlns:xlink="http://www.w3.org/1999/xlink"
    xmlns:xhtml="http://www.w3.org/1999/xhtml">
  <title>De mægtige vikinger</title>
  <switch>
    <foreignObject width="0" height="0">
      <xhtml:link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
     </foreignObject>
  </switch>
  <script type="application/ecmascript" xlink:href="js/lib/svg.js"></script>
</svg>

The above will validate in W3C Validator. FINAL UPDATE: The W3C Validator will actually not validate the above since it says the xmlns attribute doesn't exist. No browser will render the SVG if this is not set, so it's clearly a bug in the W3C Validator.

Notes

Since I couldn't find a DTD without MathML, and I don't need it, I simply opted for ignoring it. Hence: <!ENTITY % MATHML.module "IGNORE" >

The dtd I found with xhtml + math + svg doesn't have XLink (which we need to be able to add scripts), so it's included with: <!ENTITY % XLINK.xmlns "http://www.w3.org/1999/xlink" >

The favicon is working when using Firefox, Safari. It never worked in IE but I suspect that the graphic designer used pngs and not bitmaps. On Chrome and Safari this only works when not served locally.

Here is the temporary example:http://www.demægtigevikinger.dk/prototype/v0.5/ - site is no longer online

라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top