調整響應式設計的後續div的大小

-1

如何在保持精確比率的情況下重新調整響應式設計的以下<div>？調整響應式設計的後續div的大小

HTML

<div> 
    <p class="ls-l" data-ls="offsetxin:30; delayin:1000; skewxin:-40; offsetxout:-30; durationout:1000; skewxout:-40;"> 
     <span class="slide-span textStyle"> 
      <strong class="slide2-header bigBlueHeader">Louez votre matériel médical en ligne</strong> 
      <br><br> 
      LMAD est la première solution nationale de <strong>location de matériel médical</strong> 
      <br> 
      en ligne pour le domicile. Une livraison garantie du jour au lendemain<br> 
      <strong>sur toute la France</strong> et sans avance de frais. 
     </span> 
    </p> 
</div>

CSS

.textStyle { 
    color:#454545; 
    display:inline-block; 
    font-weight:300; 
    font-size:18px; 
    text-align: center; 
    line-height:22px; 
    vertical-align:top; 
    padding:13px 20px 13px 30px; 
    margin:0 0 20px 0; 
    -webkit-border-radius: 3px 3px; 
    -moz-border-radius: 3px 3px; 
    border-radius: 3px 3px; 
    white-space: nowrap; 
} 

.bigBlueHeader { 
    font-weight: 500; 
    font-size:32px; 
    line-height:40px; 
    color:#4195cd; 
    white-space: nowrap; 
    border-bottom: 1px solid #bababa; 
    padding-bottom: 10px; 
}

最後但並非最不重要這裏是什麼，我現在有一個JSFiddle Example。

來源

2014-12-04 Russel Monzur

你指的是哪個元素？代碼中沒有'div'。另外，沒有關於尺寸的信息，也沒有任何元素的尺寸規則。最後，好像你正在使用一個插件，它從'data-ls'tag獲取數據來改變'p'標籤的行爲。 – 2014-12-04 18:38:40

對不起，整個元素將在一個div。我錯過了。我想要的大小將是786,360,1024 – 2014-12-04 19:00:16

你可以重新粘貼包括div的代碼嗎？和它的任何風格？你在使用bootstrap嗎？如果是這樣，什麼版本？此外，如果該div將在另一個div中，那也會影響輸出。我們需要更多的信息。 – Termato 2014-12-04 19:25:32

我給你做一個小提琴，並加入灰色的背景，所以你可以看到格尺寸變化：http://jsfiddle.net/revn7LLt/1/

這將使用CSS媒體查詢。至少360px的寬度將div的大小設置爲360px，最大爲1000px。

CSS：

div { 

    background: #f1f1f1; 
    text-align: center; 
} 

@media screen and (min-width: 360px) { 
    div { 
     width: 360px; 
    } 
} 

@media screen and (min-width: 768px) { 
    div { 
     width: 768px; 
    } 
} 

@media screen and (min-width: 1000px) { 
    div { 
     width: 1000px; 
    } 
}

來源

2014-12-04 19:30:13 quid

什麼是最大寬度的解決方案：360，最大寬度：768px。我無法弄清楚它。 – 2014-12-04 21:12:45

我不確定我是否按照你的要求。如果你看小提琴，你可以調整四個象限。調整右下象限的寬度，你可以看到div的大小。對於至少1000px的寬度，div寬度爲1000，對於寬度至少爲768px（但小於1000px）的寬度爲768. 360的寬度有些多餘。如果將其更改爲max，則會在屏幕足夠大以接受它之前調整元素大小。 – quid 2014-12-04 21:19:07

調整響應式設計的後續div的大小

回答

相關問題