造型Wordpress小工具水平

我目前正在努力將新的Twenty Twelve Wordpress網站放在一起的兒童主題。該網站有一個液體/液體結構的響應性（使用百分比而不是固定的像素寬度 - 這將涉及我可能如何設計我的小部件）。造型Wordpress小工具水平

在我的模板的頂部，我想包括一個widgetized區域，其中用戶/管理員可以從提供的列表中的可用小部件中拖放項目。

理想情況下，由於本部分網站的設計和佈局位於水平面上，因此三個小部件在空間方面的視覺效果看起來不錯。

但是，如果用戶想要添加更多，我認爲我需要使用PHP或JavaScript來計算段標記中是否存在一定數量的div/classes/id，例如，更改CSS的寬度從33.33％（3個部件）到25％（4個部件）或50％是有兩個等等？

我將如何能夠爲每個小部件提供等間隔的寬度並將它們放在一起？

來源

2012-10-25 user1752759

請不要刪除您的原始問題 - 人們需要查看問題是什麼，才能讓您選擇的「最佳答案」有意義。 – freefaller

有些凌亂，但這裏是一個開始：

<?php 
$widgets = wp_get_sidebars_widgets(); 
$percentage = !empty($widgets['header-widget-area']) ? floor(100/count($widgets['header-widget-area'])) : 100; 
?> 
<style type="text/css"> 
hgroup .widget{ 
    width:<?php echo $percentage; ?>% !important; 
    float:left; 
} 
</style>

來源

2012-10-25 23:07:16 maiorano84

嘗試將它放在header.php文件的頂部或底部。如果這不起作用，鏈接到實時或測試版本也將有所幫助。 – maiorano84

美麗的maiorano84！ – user1752759

很高興我能幫到你。 – maiorano84

這可以用引導網格視圖來完成。
完整的細節可以發現HERE。

理論是，Bootstrap網格默認有12列。
如果你想連續3列，你將12除以4.
它會連續產生3列。您可以在Bootstrap Grid Link上看到示例。

來源

2016-01-29 12:47:11

造型Wordpress小工具水平

回答

相關問題