min-width允許你設(shè)置元素的最小寬度，它經(jīng)常與最大寬度的響應(yīng)等一起使用，本篇文章我們就來(lái)看看CSS中min-width的具體使用方法。

我們先來(lái)看看什么是min-width？

min-width屬性是允許設(shè)置元素的最小寬度。

如何使用min-width屬性？

例如，為了“讓我們可以輕松查看任何大小的瀏覽器”，假設(shè)你有一個(gè)元素可以創(chuàng)建響應(yīng)式網(wǎng)站，可以將內(nèi)容的寬度設(shè)置為width：30％;

如果在智能手機(jī)等的橫向小瀏覽器中看到的話，就變得比目標(biāo)小，即使不特意利用媒體查詢來(lái)設(shè)定其他的值，也要用數(shù)值（px）來(lái)設(shè)定min-width，所以，實(shí)際尺寸不會(huì)小于該值。

我們來(lái)看一個(gè)具體的實(shí)例

如果將CSS應(yīng)用于以下HTML，則減小瀏覽器的寬度將不會(huì)小于max-width指定的寬度。

HTML

 <div class ="container"> 
  <div class ="box"> 
    <p>請(qǐng)嘗試更改瀏覽器寬度。<br> min-width：200px;已經(jīng)設(shè)置，它
    不會(huì)小于200px。</p> 
  </div>

登錄后復(fù)制

CSS

.box{
  width: 30%;
  height: 200px;
  min-width: 200px;
  background-color: #66b6d5; 
}

登錄后復(fù)制

效果如下：

本篇文章到這里就全部結(jié)束了，關(guān)于CSS中更多屬性的內(nèi)容大家可以觀看風(fēng)君子博客的CSS視頻教程進(jìn)行學(xué)習(xí)！！！

以上就是CSS的min-width怎么使用的詳細(xì)內(nèi)容，更多請(qǐng)關(guān)注風(fēng)君子博客其它相關(guān)文章！

總結(jié)

以上是生活随笔為你收集整理的CSS的min-width怎么使用(BootStrap初学者怎么使用)的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。