IE 8 CSS问题
IE 8 CSS问题
提问于 2012-11-20 03:01:50
我的网站在IE9上看起来很好，但在IE8上就不行了。Davideugenepeterson类和id不起作用。谁能指出问题是从哪里来的？这是我的CSS：
@charset "utf-8";
body
{ min-width:839px;
max-width:none;
margin-left:0;
margin-top:0;
margin-right:0;
margin-bottom:0;
background-color:#fff; }
#Container
{ margin-left:auto;
margin-right:auto;
position:relative;
overflow:auto; }
#Banner
{ position:relative;
background-color:#000;
height:37px;
width:auto;
z-index:1; }
#Theportfolioof
{
position:absolute;
text-align:center;
width:170px;
height:37px;
left:-192px;
top:9.4px;
bottom:0;
right:0px; }
.Theportfolioof
{ white-space:nowrap;
color:#888888;
text-align:center;
letter-spacing:1.3px;
text-transform:uppercase;
word-spacing:5px;
line-height:3px;
font:normal 21px "Quaver Sans";
font-weight:100;
margin-left:auto;
margin-right:auto;
overflow:visible;
z-index:1; }
#Davideugenepeterson
{ position:absolute;
text-align:center;
width:170px;
height:37px;
left:182px;
top:1px;
bottom:0px;
right:0px; }
.Davideugenepeterson
{ white-space:nowrap;
color:#FFF;
text-align:center;
letter-spacing:0.8px;
text-transform:capitalize;
word-spacing:4px;
line-height:3px;
font :normal 18px "Pacifico";
font-size:18px;
font-weight:100;
margin-left:auto;
margin-right:auto;
overflow:visible;
z-index:1; }
#Logo
{ width:117px;
height:117px;
background-image:url(images/logo.png);
background-repeat:no-repeat;
position:absolute;
left:0;
top:37px;
bottom:0;
right:0;
margin-left:auto;
margin-right:auto;
z-index:1; }这是我的HTML：
<body>
<div id="Container">
<div id="Banner"><div id="Theportfolioof" class="Theportfolioof">the portfolio of</div><div id="Davideugenepeterson" class="Davideugenepeterson">david eugene peterson</div></div>
<div id="Logo"></div>
</div>
</div>
</div>
</body>这是IE9浏览器的屏幕截图：
这是IE8的不同之处。
我已经用W3C验证过了，css对html4.01严格有效，html也是有效的。有人知道问题出在哪里吗？就像它甚至不能识别我设置的字体。(是的，所有字体都正确安装在我的服务器上)
回答 2
Stack Overflow用户
回答已采纳
发布于 2012-11-20 04:51:26
您可能正在不同的PC上测试它。安装了IE 9的计算机安装了Pacifico和Quaver Sans，而另一个则没有。
这不是网页字体的工作方式。如果你想使用一个自定义的，你必须在CSS中定义font-family：
@font-face {
font-family: 'MyFontFamily';
src: url('fonts/myfont-webfont.eot?#iefix') format('embedded-opentype'),
url('fonts/myfont-webfont.woff') format('woff'),
url('fonts/myfont-webfont.ttf') format('truetype'),
url('fonts/myfont-webfont.svg#svgFontName') format('svg');
}其中url()包含字体相对于CSS文件的路径。
如果您没有上述所有格式的字体文件，请使用Font Squirell's @font-face generator。如果你想知道你是否真的需要所有这些，请查看The New Bulletproof @Font-Face Syntax。
Stack Overflow用户
发布于 2012-11-20 03:20:24
您的.Davideugenepeterson类的一个属性中有一个拼写错误：
font :normal 18px "Pacifico";应该是：
font: normal 18px "Pacifico";我打赌IE8CSS解析器读取"font " (带空格)作为属性名，但无法识别它。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/13460353
复制相关文章
相似问题
腾讯云开发者
