侧边栏的变化

Question

想知道我可以使用哪些代码来更改侧边栏的外观，例如“类别”“标签云”如何将自己放入框中？现在他们中的许多人与盒子齐平（右），一直是中心，但它并不漂亮。不知道它可能会改变什么，例如在样式表或侧边栏中？

使用这个主题：http://wp-themes.com/colors/?TB_iframe=true

已经用这样的填充测试过： .widget { 边距底部：12px； 填充：5px； }

但没有成功。

关于如何解决此问题的建议？我是个菜鸟，英语也不是很好，但还是试试吧。 ;)

样式.css

     Sidebar Styles
====================================================================================================  ========================================
*/
#sidebarLayout {width:228px; float:left; margin-left:15px; margin-top:1px;}
.widget { margin-bottom:12px;}
.wdTitle {height:38px; width:228px; background:url(layout/wdTitleBg.png);}
.wdTitle h2 {color:#FFFFFF; font-size:10pt; font-weight:400; line-height:34px; margin-left:15px;}
.wdContent {background:#e1e5e7; width:227px; margin-left:1px; padding-bottom:30px; padding-top:3px;
line-hight:100%;}
.wdContent li:hover {no-repeat;}
.wdContent li {line-height:15px; height:35px; padding-left:25px; margin:1.5px 0px;}
.wdContent ul li ul { display:none; }
.wdFooter {height:4px; background:url(layout/wdFooterBg.png); width:227px; margin-left:1px;}
.wicon {width:34px; height:24px; background:url(layout/widgetIcon.png) no-repeat; float:left; margin-right:2px;}
/* 

Sidebar.php:

    <div id="sidebarLayout">

<div class="widget">
 <div class="wdTitle">
  <h2>Sök?</h2>
 </div>
 <div class="wdContent">
  <div class="icon" id="searchIcon"></div>
   <?php get_search_form(); ?>
  </div>
 <div class="wdFooter"><!-- .wdFooter for design only --></div>
</div>

<!-- <?php if ( function_exists('wp_tag_cloud') ) : ?>
<div class="widget">
 <div class="wdTitle">
  <h2>Etikettmoln</h2>
 </div>
 <div class="wdContent">
  <div>
   <div id="etikettmoln">
    <?php $tags = wp_tag_cloud('orderby=count&order=RAND'); ?>
   </div>
  </div>
 </div>
 <div class="wdFooter"></div>
</div>
<?php endif; ?> -->

 <?php if(!function_exists("dynamic_sidebar") || ! dynamic_sidebar('sidebar')) : ?><?php endif;?>
</div>

我为那些不了解它的人使用 Wordpress。

感谢您的帮助！

Answer 1

要更改主题的外观，您必须修改主题目录中的 style.css 文件。

我会添加

.wdContent > div { padding: 5px;}

到你的主题目录中的 style.css 文件，它会在你的云周围放置一个 5px 的边框。

你可能还会发现这样一行

.wdContent {背景：#e1e5e7;宽度：227px；左边距：1px；填充底部：30px；填充顶部：3px； 行高：100%;}

并将 padding-bottom 更改为 3px，就像 padding-top 一样

我认为这些更改会稍微改善一些情况。