bootstrap段为不同设备格式化

Question

嗨我是相当新的bootstrap，我试图实现的是有一个jumbotron在我的页面顶部不同的段落格式，以适应背景图像，这需要说30全宽空间的百分比。

我用padding-left: 300px;抵消了我的文字，在桌面上看起来很好，但是这个规则也适用于移动设备模式下的段落，导致它非常瘦而高。

有没有一种方法可以让我们说3个不同的段落，每个段落都显示在一定的屏幕尺寸下？

Answer 1

只需使用媒体查询：

@media screen and (max-width: 320px) 
{ 
    p{ 
     padding-left: 0; 
    } 
} 

@media screen and (min-width: 321px) and (max-width:800px) 
{ 
    p{ 
     padding-left: 100px; 
    } 
} 

@media screen and (min-width: 801px) 
{ 
    p{ 
     padding-left: 300px; 
    } 
}