我很困惑!我製作了一個簡單的網頁來顯示圖片和文字。它的響應速度很快,並且在Firefox,Chrome,Safari和Internet Explorer 10中運行良好,但在Internet Explorer 11中運行良好。主頁無法通過Internet Explorer 11響應
問題是它沒有響應,它需要很長時間才能加載,並且不顯示字體在Internet Explorer中的令人敬畏的圖標11.這可能是什麼原因,以及如何解決這個問題?真的很有幫助,因爲我無法找到任何解決方案,當我谷歌周圍。謝謝!
@import url(http://fonts.googleapis.com/css?family=Shadows+Into+Light);
a {
text-decoration: none;
color: #2952a1;
}
html
{
overflow-y: scroll;
}
body {
margin:0;
padding:0;
height:100%;
color: #7F7F7F;
height: 100%;
}
#wrapper {
margin-top: 2%;
width: 100%;
height: 100%;
}
#card {
height: 100%;
margin: 0 auto;
width: 80%;
}
#mobileH1 {
display: none;
}
#desktopH1 {
display: block;
}
#leftSide {
height: auto;
float: left;
width: 50%;
}
#rightSide {
padding-top: 5%;
float: right;
width: 49%;
height: auto;
}
#leftSide img {
display: block;
height: auto;
width: 100%;
padding-top: 1%;
margin: 0 auto;
}
h1 {
text-align: left;
font-family: 'Shadows Into Light', cursive;
font-weight: 400;
font-size: 55px;
margin: 0;
}
p {
font-family: 'Dancing Script', cursive;
font-family: 'Shadows Into Light', cursive;
font-size: 28px;
margin: 0;
padding: 10px;
}
@media only screen and (min-width: 150px) and (max-width: 768px)
{
#mobileH1 {
display: block;
}
#desktopH1 {
display: none;
}
#card {
width: 90%;
}
#leftSide {
width: 100%;
}
#rightSide {
float: left;
padding-top: 0;
width: 100%;
}
#leftSide img {
width: 80%;
padding-top: 1%;
}
h1 {
font-size: 36px;
text-align: center;
}
p {
font-size: 24px;
}
}
@media only screen and (min-width: 150px) and (max-width: 320px)
{
h1 {
font-size: 28px;
text-align: center;
}
}
<!DOCTYPE html>
<html lang="sv">
<head>
\t <title>Konstkort & affischer</title>
\t <meta name="description" content="Description text" />
\t <meta name="viewport" content="width=width-device, initial-scale=1" />
\t <meta charset="utf-8" />
\t <link href="stylesheet.css" rel="stylesheet" type="text/css">
\t <link href="http://maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">
\t
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<!-- css3-mediaqueries.js for IE less than 9 -->
<!--[if lt IE 9]>
<script src="http://css3-mediaqueries-js.googlecode.com/svn/trunk/css3-mediaqueries.js"></script>
<![endif]-->
\t
</head>
\t <body>
\t \t <div id="wrapper">
\t \t \t <div id="card">
\t \t \t \t <div id="leftSide">
\t \t \t \t <h1 id="mobileH1">Headline!</h1>
\t \t \t \t <img src="bilder/blomma.jpg"/>
\t \t \t \t </div>
\t \t \t \t <div id="rightSide">
\t \t \t \t <h1 id="desktopH1">Headline</h1>
\t \t \t \t <p>
\t \t \t \t Text
\t \t \t \t </p>
\t \t \t \t <p>
\t \t \t \t <i class="fa fa-phone fa-lg"></i> Phone number<br>
\t \t \t \t <i class="fa fa-envelope fa-lg"></i> Mail
\t \t \t \t </p>
\t \t \t \t </div>
\t \t \t </div>
\t \t </div>
\t </body>
</html>
您是否正在觀看該網站的實際版本的IE11或者它是模擬器?早些時候有一些錯誤,谷歌,雅虎,引導和許多其他網站看起來很奇怪,但是這是成功的。可能想嘗試使用IE邊緣元標籤來查看是否有幫助。 – Christina 2014-10-09 02:54:59