trouble getting declared namespaces to work

2019-03-02 13:04发布

I am trying to get namespaces written in an external css (two separate files actually). When I run the file on my browser it will not use the declared namespaces. I think that the file is calling the css file but its not applying the namespaced style

HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<?xml version="1.0" encoding="utf-8"?>


<html xmlns:act="http://www.superstarmovies.com/actors" 
  xmlns:mov="http://www.superstarmovies.com/movies"
  xmlns="http://www.w3.org/1999/xhtml" >

<head>
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=utf-8" />
<title>Superstar Movies: Stars of the Month</title>
<link rel="stylesheet" href="movies.css"  type="text/css" ?>
<link rel="stylesheet" href="actors.css" type="text/css" ?>
<link rel="stylesheet" href="superstar.css" type="text/css" />
</head>

<body>
<div id="heading"><img src="logo.gif" alt="Superstar Movies" /></div>

<div id="main">
<h1>Stars of the Month</h1>
<h3>Movies by Our Featured Stars!</h3>
<act:actors>

    <act:actor>
        <act:name>Halle Berry</act:name>
    <act:date>August 14, 1966</act:date>
    <act:birthplace>Cleveland, Ohio</act:birthplace>
          <mov:movie genre="action" star="Halle Berry">
        <mov:name>Catwoman</mov:name>
    <mov:date>(2004)</mov:date>
    <mov:length>104 minutes</mov:length>
    </mov:movie>

    <mov:movie genre="horror" star="Halle Berry">
        <mov:name>Gothika</mov:name>
    <mov:date>(2003)</mov:date>
    <mov:length>98 minutes</mov:length>
    </mov:movie>

    <mov:movie genre="drama" star="Halle Berry">
        <mov:name>Monster&apos;s Ball</mov:name>
    <mov:date>(2001)</mov:date>
    <mov:length>111 minutes</mov:length>
    </mov:movie>

    <mov:movie genre="fantasy" star="Halle Berry">
        <mov:name>X-Men</mov:name>
    <mov:date>(2000)</mov:date>
    <mov:length>104 minutes</mov:length>
    </mov:movie>

    <mov:movie genre="romance" star="Halle Berry">
        <mov:name>Jungle Fever</mov:name>
    <mov:date>(1991)</mov:date>
    <mov:length>132 minutes</mov:length>
    </mov:movie>
    </act:actor>

    <act:actor>
    <act:name>Tom Hanks</act:name>
    <act:date>July 9, 1956</act:date>
    <act:birthplace>Concord, California</act:birthplace>

<mov:movie genre="drama" star="Tom Hanks">
    <mov:name>Catch Me If You Can</mov:name>
<mov:date>(2002)</mov:date>
<mov:length>141 minutes</mov:length>
</mov:movie>

<mov:movie genre="adventure" star="Tom Hanks">
    <mov:name>Cast Away</mov:name>
<mov:date>(2000)</mov:date>
<mov:length>143 minutes</mov:length>
</mov:movie>

<mov:movie genre="action" star="Tom Hanks">
    <mov:name>Saving Private Ryan</mov:name>
<mov:date>(1998)</mov:date>
<mov:length>170 minutes</mov:length>
</mov:movie>

<mov:movie genre="adventure" star="Tom Hanks">
    <mov:name>Apollo 13</mov:name>
<mov:date>(1995)</mov:date>
<mov:length>140 minutes</mov:length>
</mov:movie>

<mov:movie genre="comedy" star="Tom Hanks">
    <mov:name>Forrest Gump</mov:name>
<mov:date>(1994)</mov:date>
<mov:length>142 minutes</mov:length>
</mov:movie>

<mov:movie genre="drama" star="Tom Hanks">
    <mov:name>Philadelphia</mov:name>
<mov:date>(1993)</mov:date>
<mov:length>125 minutes</mov:length>
</mov:movie>

<mov:movie genre="comedy" star="Tom Hanks">
    <mov:name>Big</mov:name>
<mov:date>(1988)</mov:date>
<mov:length>104 minutes</mov:length>
</mov:movie>
    </act:actor>

</act:actors>
</div>

 <address>
Superstar Movies &#183; 123 Moviestar Lane &#183; Hollywood, FL 12345
</address>

</body>

</html>

CSS

 @namespace act "http://www.superstarmovies.com/actors";

act|actor        {display: block; font-family: Arial, Helvetica, sans-serif;
          margin-bottom: 20pt}

act|name, act|date   {display: block}

act|name         {font-size: 14pt; color: DarkRed; font-style: bold}

act|date, act|birthplace   {display: inline; font-style: italic; color: DarkRed}

act|birthplace         {padding-left: 0.5em}

@namespace mov "http://www.superstarmovies.com/movies";

mov|movie        {display:block; font-family: Arial, Helvetica, sans-serif}

mov|name, mov|date, mov|length  {display: inline}

mov|name         {font-style: bold; color:#003;}

mov|length       {font-style: italics; padding-left: 0.5em}

Thoughts?

1条回答
Viruses.
2楼-- · 2019-03-02 13:36

In your XHTML:

  1. Your markup is not well-formed:

    • Your XML declaration should come first, then your doctype declaration:

      <?xml version="1.0" encoding="utf-8"?>
      <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
      
    • Some of your <link /> tags aren't closed properly, they should be:

      <link rel="stylesheet" href="movies.css"  type="text/css" />
      <link rel="stylesheet" href="actors.css" type="text/css" />
      
  2. Your page must be served as application/xhtml+xml by the server. Typical servers don't know that you're serving XHTML, so they send them as text/html instead. Browsers won't be able to treat text/html files as XML, so they won't apply CSS to your custom XML elements.

    If you work with PHP, it's simply a matter of adding this to the very top of your XHTML file:

    <?php header('Content-Type: application/xhtml+xml'); ?>
    

    Or in ASP, add this:

    <% Response.ContentType = "application/xhtml+xml"; %>
    

    You should also have an accompanying meta tag, but it's not necessary for your page to validate, and browsers ignore it anyway:

    <meta http-equiv="Content-Type" content="application/xhtml+xml; charset=utf-8" />
    

    You can find a short history lesson on UAs treating XHTML as HTML tag soup in this answer to better understand this.

In your CSS:

  1. It's font-weight: bold, not font-style: bold.

  2. It's font-style: italic, not font-style: italics.

  3. Make sure that your @namespace statements are placed at the beginning of your stylesheets. From the spec:

    Any @namespace rules must follow all @charset and @import rules and precede all other non-ignored at-rules and rule sets in a style sheet.


But with all that said, why aren't you placing your actors and movies into their own XML files, then transforming them using XSLT into familiar, actual XHTML?

查看更多
登录 后发表回答