基金會6 Break point

Question

我是新來的基金會，我原本是一個bootstraper。我有一個3列行，我創建了一個容器，最大寬度爲1300px;

我的問題是我需要它在767打破單列，但現在它不會破壞，直到640px，是由列控制？

<div class="row expanded"> 
    <div class="container"> 
    <h3>News</h3> 
    <div class="columns small-12 small-4 medium-4">  
     <img src="img.png"> 
     <span class="text-element">Text</span> 
     <h5>Heading Level 5</h5> 
     <a class="link-button button" href="#">Learn More</a> 
    </div> 
    <div class="columns small-12 small-4 medium-4">  
     <img src="img.png">  
     <span class="text-element">Text</span> 
     <h5>Heading Level 5</h5> 
     <a class="link-button button" href="#">Learn More</a> 
    </div> 
    <div class="columns small-12 small-4 medium-4"> 
     <img src="img.png">  
     <span class="text-element">Text</span> 
     <h5>Heading Level 5</h5> 
     <a class="link-button button" href="#">Learn More</a> 
    </div> 
    </div> 

Answer 1

基金會的默認斷點（as noted here）：

小 - > 640像素， 中 - > 1,024像素 大 - 1,024像素和更大。

如果您希望控制這些斷點，您需要切換到sass版本，您只需更改寬度並根據需要配置框架即可。鏈接在這裏：http://foundation.zurb.com/sites/docs/media-queries.html#default-media-queries

在我看來，基金會是更靈活然後bootstrap - 所以它可能需要時間來調整，但它是完全值得的。

享受！