Question

我有一个名为 Titulos.css 的简单css文件，其中包含：

h1 {    font: 50px Tahoma, Helvetica, Arial, Sans-Serif; text-align: center; color: #111; text-shadow: 0px 2px 3px #555;    }
h2 {    font: 14px Tahoma, Helvetica, Arial, Sans-Serif; text-align: center; color: #CCC; text-shadow: 0px 1px 2px #555;    }
h3 {    font: 10px Tahoma, Helvetica, Arial, Sans-Serif; text-align: center; color: #CCC;   }
b1 {    font: 16px Tahoma, Helvetica, Arial, Sans-Serif; color: #DDD;   }
b2 {    font: 10px Tahoma, Helvetica, Arial, Sans-Serif; color: #F9F7ED;    }
.caja {  width: 690px; height: 40px; background-color: transparent; border: 0px solid #000000; font-size:x-large; color: #222; font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif; font-weight: bold;" size="299";  }
.style1 {   text-align: right; }

将此文件称为“

”的页面

<link rel="stylesheet" type="text/css" href="LIB/titulos.css" />

稍后在本页中我试图使用一些样式：

<div id="todo" align="center" >
    <div id="cabeza" style="width:850px;height:100px">
    </div>
    <div id="contenido" style="width:850px;height:420px;background-image: url(IMG/cuadro.png)" >
        <div id="titulo" style="width:765px;height:75px;padding-top: 18px;margin: auto;text-align: left;">
            <b1>Bienvenido <b><?php echo($username); ?></b></b1><br>
            <?php $check = mysql_query("SELECT * FROM sms WHERE ref = '".$username."' ORDER BY fecha DESC LIMIT 0, 1") or die(mysql_error());
            while($info = mysql_fetch_array( $check )) { 
                echo("<b1> Tu ultimo mensaje enviado fue: </b1><b2>" . $info['texto'] . " enviado el " . $info['fecha'] . "</b2>");

当然只有代码的一部分，思想是，Firefox和Chrome会像这样显示上面的代码： alt text http://img31.imageshack.us/img31/8814/bieng.jpg 正如您所看到的那样，应用了样式。但是当我看到来自IE 8（甚至7或6）的代码时，这就是你所看到的： alt text http://img268.imageshack.us/img268/8132/malcu.jpg 那么，您怎么看？

Answer 1

<b1>和b2不是html元素。现代浏览器（Firefox，Chrome等）会自动检测这些并将css规则应用到它们上（作为错误检测），但Internet Explorer无法应用css规则，因为它们不是html标记。

我建议您替换<b1>＆amp; <b2>带有实际标签（并使用css类），或者如果你想要hack，请将document.createElement("b1");document.createElement("b2")放在脚本中。它将强制IE7和8应用css规则。

示例：

    h1 {    font: 50px Tahoma, Helvetica, Arial, Sans-Serif; text-align: center; color: #111; text-shadow: 0px 2px 3px #555;    }
    h2 {    font: 14px Tahoma, Helvetica, Arial, Sans-Serif; text-align: center; color: #CCC; text-shadow: 0px 1px 2px #555;    }
    h3 {    font: 10px Tahoma, Helvetica, Arial, Sans-Serif; text-align: center; color: #CCC;   }
    /* classes */
    .b1 {    font: 16px Tahoma, Helvetica, Arial, Sans-Serif; color: #DDD;   }
    .b2 {    font: 10px Tahoma, Helvetica, Arial, Sans-Serif; color: #F9F7ED;    }
    .caja {  width: 690px; height: 40px; background-color: transparent; border: 0px solid #000000; font-size:x-large; color: #222; font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif; font-weight: bold;" size="299";  }
    .style1 {   text-align: right; }

和

<div id="todo" align="center" >
    <div id="cabeza" style="width:850px;height:100px">
    </div>
    <div id="contenido" style="width:850px;height:420px;background-image: url(IMG/cuadro.png)" >
        <div id="titulo" style="width:765px;height:75px;padding-top: 18px;margin: auto;text-align: left;">
<!-- assuming headers -->
            <h1 class="b1">Bienvenido <b><?php echo($username); ?></b></h1><br>
            <?php $check = mysql_query("SELECT * FROM sms WHERE ref = '".$username."' ORDER BY fecha DESC LIMIT 0, 1") or die(mysql_error());
            while($info = mysql_fetch_array( $check )) { 
                echo("<h1 class='b1'> Tu ultimo mensaje enviado fue: </h1><h2 class='b2'>" . $info['texto'] . " enviado el " . $info['fecha'] . "</h2>");

Css简单风格不适用于IE，但在任何其他浏览器中都是如此

1 个答案: