2012-10-22 17 views
0

我在IE瀏覽器中顯示我的html/css文檔時遇到了問題,它在firefox和chrome中運行良好,所以我猜這是因爲我沒有插入任何文檔類型,當我插入xhtml或html的文檔類型時它不起作用,它只會顯示我的標題部分,我應該爲doctype包含什麼內容?插入doctype html內容時不會顯示

我這個嘗試之一:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
     <html xmlns="http://www.w3.org/1999/xhtml"> 
    <head> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 

並且不working.here是我的代碼工作:

<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
<meta http-equiv="pragma" content="no-cache"> 
<meta http-equiv="cache-control" content="no-cache"> 
<meta http-equiv="expires" content="0"> 
<title>bazar</title> 
<style type="text/css"> 

#container { 
width: 770px; 
margin: 0 auto 
} 
#main 
{ 
width:100%; 
height:100%; 
up:0; 
bottom:0; 
margin:0; 
} 
#header 
{ 
position:fixed; 
background:url(header_slice.png); 
repeat x; 
width:100%; 
height:63px; 
top:0; 
left:0; 
right:0; 
} 
#logo 
{ 
position:fixed; 
background:url(logo.png); 
width:192; 
height:59; 
float:right; 
left:900; 
} 
#mymenu 
{ 
position:fixed; 
background:url(menu.png); 
width:302; 
height:19; 
top:30; 
left:122.5; 
overflow:auto; 
} 
#mytext 
{ 
position:fixed; 
background:url(textbox.png); 
width:257; 
height:20; 
top:30; 
left:460; 
} 
#nav{ 
position:absolute; 
background:url(navigation_slice.jpg); 
repeat x; 
width:100%; 
height:148; 
top:63; 
z-index:1000; 
left:0; 
right:0; 
} 
#mycontainer 
{ 
position:absolute; 
background:white; 
repeat x; 
repeat y; 
width:100%; 
height:1281; 
top:210; 
left:0; 
right:0; 
} 
#menu2 
{ 
position:absolute; 
background:url(navbar.png); 
repeat x; 
width:952; 
height:67; 
top:40; 
left:125; 
} 
#home 
{ 
position:absolute; 
background:url(home.png); 
width:52; 
height:36; 
top:30; 
left:0; 
} 
#pencil{ 
position:absolute; 
background:url(pencil.png); 
width:39; 
height:42; 
top:7; 
right:23; 
} 
#archive{ 
position:absolute; 
background:url(archive.png); 
width:38; 
height:37; 
top:7; 
right:110; 
} 
#sep1{ 
position:absolute; 
repeat y; 
width:2; 
height:67; 
top:0; 
right:78; 
} 
#sep2{ 
position:absolute; 
repeat y; 
width:2; 
height:67; 
top:0; 
right:173; 
} 
#sep3{ 
position:absolute; 
repeat y; 
width:2; 
height:67; 
top:0; 
right:284; 
} 
#sep4{ 
position:absolute; 
repeat y; 
width:2; 
height:67; 
top:0; 
right:388; 
} 
#sep4{ 
position:absolute; 
repeat y; 
width:2; 
height:67; 
top:0; 
right:459; 
} 
#sep4{ 
position:absolute; 
repeat y; 
width:2; 
height:67; 
top:0; 
right:386; 
} 
#sep5{ 
position:absolute; 
repeat y; 
width:2; 
height:67; 
top:0; 
right:459; 
} 
#sep6{ 
position:absolute; 
repeat y; 
width:2; 
height:67; 
top:0; 
right:526; 
} 
#sep7{ 
position:absolute; 
repeat y; 
width:2; 
height:67; 
top:0; 
right:596; 
} 
#sep8{ 
position:absolute; 
repeat y; 
width:2; 
height:67; 
top:0; 
right:670; 
} 
.sep{ 
background:url(sep.png); 
} 
#seminar 
{ 
position:absolute; 
background:url(seminar.png); 
right:204; 
width:45; 
height:33; 
top:7; 
} 
#learn 
{ 
position:absolute; 
background:url(learning.png); 
right:312; 
width:44; 
height:36; 
top:7; 
} 
#art{ 
position:absolute; 
background:url(art.png); 
width:45; 
height:40; 
top:5; 
right:400; 
} 
#engineer{ 
position:absolute; 
background:url(engineer.png); 
width:54; 
height:36; 
top:7; 
right:470; 
} 
#publish{ 
position:absolute; 
background:url(publish.png); 
width:49; 
height:38; 
top:7; 
right:539; 
} 
#new{ 
position:absolute; 
background:url(new.png); 
width:36; 
height:31; 
top:7; 
right:610; 
} 
#contact 
{ 
position:absolute; 
background:url(contact.png); 
width:178; 
height:58; 
top:17; 
right:610; 
left:125; 
} 
#rect1 
{ 
width:716; 
height:308; 
top:-35; 
left:125; 
} 
#rect2 
{ 
width:226; 
height:308; 
top:-35; 
left:850; 
} 
.rect 
{ 
position:absolute; 
background:url(rect.png); 
repeat x; 
repeat y; 
} 
#special 
{position:absolute; 
background:url(special.png); 
width:696; 
height:255; 
top:-30; 
left:132; 
z-index:1000; 
} 
#chasb 
{ 
position:absolute; 
background:url(chasb.png); 
width:56; 
height:62; 
top:50; 
right:300; 
z-index:1000; 
} 


#takhte 
{ 
position:absolute; 
background:url(takhte.png); 
width:51; 
height:58; 
top:170; 
right:300; 
z-index:1000; 
} 
#sabad1{ 
position:absolute; 
width:80; 
height:17; 
top:210; 
right:370; 
z-index:1000; 
} 
#sabad2{ 
position:absolute; 
width:80; 
height:17; 
top:90; 
right:370; 
z-index:1000; 
} 
.sabad 
{ 
background:url(sabad.png); 
} 

#left 
{ 
position:absolute; 
background:url(slideleft.png); 
top:280; 
left:125; 
width:20; 
height:69; 
z-index:2000; 
} 
#right 
{ 
position:absolute; 
background:url(slideright.png); 
top:280; 
left:822; 
width:17; 
height:69; 
z-index:2000; 
} 
#slide 
{ 
position:absolute; 
top:280; 
left:125; 
width:716; 
height:69; 
z-index:1500; 
} 
#staff 
{ 
position:absolute; 
background:url(staff.png); 
width:228; 
height:70; 
top:280; 
z-index:1000; 
left:850; 
} 
#mybox 
{ 
position:absolute; 
background-color: white; 
top:0; 
left:865; 
width:200; 
height:260; 
z-index:900; 
} 
#product 
{ 
position:absolute; 
background:url(products.png); 
width:200; 
height:76; 
top:-30; 
left:865; 
z-index:1000; 
} 
</style> 
</head> 
<body> 
<div id='main'> 
<div id='header'> 
<div id='logo'></div> 
<div id='mymenu'></div> 
<div id='mytext'></div> 
<div id='nav'> 
<div id='menu2'> 
     <div id='home'></div><div id="pencil"></div> 
     <div id="sep1" class="sep"></div><div id="archive"></div> 
     <div id="sep2" class="sep"></div><div id="seminar"></div> 
     <div id="sep3" class="sep"></div><div id="learn"></div> 
     <div id="sep4" class="sep"></div><div id="art"></div> 
     <div id="sep5" class="sep"></div><div id="engineer"></div> 
     <div id="sep6" class="sep"></div><div id="publish"></div> 
     <div id="sep7" class="sep"></div><div id="new"></div><div id="sep8" class="sep"></div> 
</div> 
<div id='contact'></div> 
</div> 

</div> 

<div id='mycontainer'> 

<div id='rect1' class='rect'></div> 
<div id='rect2' class='rect'></div> 
<div id='special'></div> 
<div id='chasb'></div><div id='takhte'></div><div id='sabad1' class="sabad"></div><div id='sabad2' class="sabad"></div> 
<div id='mybox'></div> 
<div id='product'></div> 
<div id='staff'></div> 
<div id='slide' class="rect"></div> 
<div id='left'></div><div id='right'></div> 
</div> 

</div> 

</body> 
</html> 

正如我所說的,包括DOCTYPE將只顯示標題

+0

什麼版本的Internet Explorer?這個問題也可能出現在你的CSS中,你也應該包括這個。 – Jrod

+0

我希望它可以在所有瀏覽器中運行,我的ie版本是8 – Nickool

+0

至少您需要關閉元標記,例如/>,並且您需要爲樣式設置類型,如