0

我一直在尝试建立自己的网站；我正在阅读 RWD（响应式网页设计）。我遇到了 IE 问题。我可以为 IE<=8 设置默认样式显示，但我看到了 [1]：http ://www.etondigital.com站点 您可以访问该站点，并且在禁用 javascript 的 IE 7 中仍然可以响应。我很难弄清楚这是怎么可能的。它从三列变为一列。如果您了解网站功能，请告诉我。谢谢

/ * *** *我已经添加了我的代码，并且关于我附加的链接，我如何在没有javascript的情况下在Ie8及以下实现将它从三行更改为一行而没有任何通知，如eton数字网站

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Second Theme</title>
        <meta name="viewport" content="width=device-width, initial-scale=1"/>
            <!--so html 5 tags work in ie browsers 8 and lower-->
        <!--[if lt IE 9]>
        <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
        <![endif]-->
        <style type="text/css">
        body{
   font:normal 100% Cambria, Georgia, serif;
   margin:10px;
}

.wrapper{
    margin: 0em auto;
    width: 93.75%;      /* 960/1024 */
    background:gray;
    padding:.625em;

}


.box{
width:29.847%;/*274/918*/
    float:left;
    margin-right:2em;
}

.clear{
    clear:both;
}

        </style>
    <body>
       <div class="warapper">
        <aside class="bottom_sidebar">
            <div class="box one">
                <h1>One</h1>
                <p>is simply dummy text of the printing and typesetting 
                    industry. Lorem Ipsum has been the industry's standard 
                    dummy text  ever since the 1500s, when an unknown printer
                     took a galley of type and scrambled it to make a</p>

            </div>
            <div  class="box">
                <h1>Two</h1>
                <p>is simply dummy text of the printing and typesetting 
                    industry. Lorem Ipsum has been the industry's standard 
                    dummy text  ever since the 1500s, when an unknown printer
                     took a galley of type and scrambled it to make a</p>
            </div>
            <div  class="box">
                <h1>Three</h1>
                <p>is simply dummy text of the printing and typesetting 
                    industry. Lorem Ipsum has been the industry's standard 
                    dummy text  ever since the 1500s, when an unknown printer
                     took a galley of type and scrambled it to make a</p>
            </div> 
            <div class="clear"></div>
        </aside>
    </div>
    </body>
</html>
4

2 回答 2

1

如果您对所有块级元素使用基于百分比的宽度，则可以使您的网站响应式，而无需使用@mediaCSS at-rule。否则，您将需要使用 JavaScript 来让网站响应 IE 中的媒体查询。

于 2013-02-12T03:21:09.180 回答
0

最好的方法，也是最简单的方法，是通过引导程序。它与 IE7+ 兼容，可以随心所欲。它不是一个模板，而是一组 .css 文件，这些文件预先编码了类，使您可以在短时间内构建最佳的响应式布局。我建议花一些时间在 Google 上搜索 Bootstrap 并阅读所有有关详细信息，但Bootstrap 绝对是要走的路。

http://twitter.github.com/bootstrap/index.html

于 2013-02-12T03:28:54.323 回答