小编Gar*_*ryP的帖子

如何使用@media媒体查询定位特定的屏幕大小?

我是响应式设计的新手,我现在正在使用twitter bootstrap responsive.css.我的项目遇到了一些麻烦.

麻烦的是,我的左栏不会崩溃(如果这是正确的术语),或者不会叠加.我想要的是,左列应移动到span8列下方并调整其宽度.它现在做的是,左列的宽度减小并挤压其内部的所有内容.我的目标是768x1024媒体屏幕的移动屏幕尺寸.

布局的基本标记是,左边是span8,右边是span4.span4是我的其他块.

<div class="row">
<div class="span8">
    some block with contents
</div>

<div classs="span4">
    <div class="sideBlock"><!--fluid width was set-->
        <img src="http://placehold.it/298x77">
    </div>
</div>
Run Code Online (Sandbox Code Playgroud)

我的主要问题是,我们如何使用媒体查询(使用twitter bootstrap)来定位特定的屏幕大小.然后定制它以满足我们的需求?

media-queries responsive-design twitter-bootstrap

5
推荐指数
2
解决办法
3万
查看次数