2011-12-16 50 views
4

我使用Twitter的引導作爲CSS框架和思維爲什麼要浪費這個空間時,我可以有效地使用它當多數顯示器現在對1280 X n分辨率?我非常喜歡Bootstrap,所以我不想現在就停下來,重新開始編寫更大屏幕的CSS(或者我的老闆想要的全屏寬度)的整個過程。是否有可能覆蓋網格系統使用全寬

是否有可能改變/改變黑客或你的名字,調整到全屏或至少1200PX大小,而現在使用940像素的CSS文件?

回答

2

那麼這很簡單,我用所有的好東西從Twitter的引導造型,但剝離了網格系統由Zurb Foundation Grid Systemhere被替換。我沒有什麼比通過不再爲移動瀏覽器實施網站而獲得額外時間更多的了。感謝社區

+0

風格我一直在考慮自己做這個,是否有很多調整涉及?你能分享結果嗎? – 2012-01-04 17:19:38

0

賦予了新的價值被載入

.container { 
    width: 1200px; 
} 
.container-fluid { 
    min-width: 1200px; 
} 
+0

這是否使跨度的寬度比較?或者他們將是40px寬度?我只是想從「ZURB基金會」的網格,但使用Twitter的BootStrap – Deeptechtons 2011-12-16 16:16:43

0

另一種方式我這樣做是創建一個div的fluid-span一個ID,然後使用下面的JQuery的TW-bs.css後級應用適當的引導跨度類中間列的內容 - 實際上,這總會讓中間相對於用戶的瀏覽器窗口大小的內容:

<div class="row"> 

<div id="fluid-span"> 

[content goes here] 


</div> 

<div class="span4"> 

[this is your right sidebar content] 

</div></div> 

而這裏的JQuery的:

$(function(){ 
var width = $(window).width(), 
new_class = width >= 1571 ? 'span17' : 
      width >= 1411 ? 'span15' : 
      width >= 1251 ? 'span12' : 
      width >= 995 ? 'span8' : 'span8'; 
$('#fluid-span').removeClass('span17 span15 span12 span8').addClass(new_class); 
//alert(width); 
}); 

它的基本功能是將適當的跨度類追加到ID爲fluid-span的div。希望這有助於任何人在那裏尋找Bootstrap的固定/流體解決方案!

這樣做的一個限制是它不是動態的 - 如果您調整瀏覽器窗口的大小,則必須刷新頁面才能使代碼正常工作。我敢肯定,有人用真JQuery的技能可以重寫這更好的做到這一點:)

相關問題