修改Box样式，调整前台区块显示效果

oscommerce 默认采用Jquery UI 实现各box的效果。
通过添加修改CSS 能覆盖原始效果实现子定义
我们以includes/modules/bm_information.php 为例子
可以看到

function execute() {
      global $oscTemplate;

      $data = '<div class="ui-widget infoBoxContainer">' .
              '  <div class="ui-widget-header infoBoxHeading">' . MODULE_BOXES_INFORMATION_BOX_TITLE . '</div>' .
              '  <div class="ui-widget-content infoBoxContents">' .
              '    <a href="' . tep_href_link(FILENAME_SHIPPING) . '">' . MODULE_BOXES_INFORMATION_BOX_SHIPPING . '</a><br />' .
              '    <a href="' . tep_href_link(FILENAME_PRIVACY) . '">' . MODULE_BOXES_INFORMATION_BOX_PRIVACY . '</a><br />' .
              '    <a href="' . tep_href_link(FILENAME_CONDITIONS) . '">' . MODULE_BOXES_INFORMATION_BOX_CONDITIONS . '</a><br />' .
              '    <a href="' . tep_href_link(FILENAME_CONTACT_US) . '">' . MODULE_BOXES_INFORMATION_BOX_CONTACT . '</a>' .
              '  </div>' .
              '</div>';

      $oscTemplate->addBlock($data, $this->group);
    }

一个box 就是 一个外部div 内嵌两个DIV:   一个infoBoxHeading  和 一个 infoBoxContents

其中ui-widget，  ui-widget-header，   ui-widget-content   为Qjquery UI CSS样式

infoBoxContainer， infoBoxHeading，  infoBoxContents 为osCommerce 默认stylesheet.css 中定义的CSS
 

了解了结构 加一个ID即可方便的定义自己的CSS
代码改写如下
 

function execute() {
      global $oscTemplate;

      $data = '<div class="infoBoxContainer" id="infobox">' .
              '  <div class="infoBoxHeading">' . MODULE_BOXES_INFORMATION_BOX_TITLE . '</div>' .
              '  <div class="infoBoxContents">' .
              '    <a href="' . tep_href_link(FILENAME_SHIPPING) . '">' . MODULE_BOXES_INFORMATION_BOX_SHIPPING . '</a><br />' .
              '    <a href="' . tep_href_link(FILENAME_PRIVACY) . '">' . MODULE_BOXES_INFORMATION_BOX_PRIVACY . '</a><br />' .
              '    <a href="' . tep_href_link(FILENAME_CONDITIONS) . '">' . MODULE_BOXES_INFORMATION_BOX_CONDITIONS . '</a><br />' .
              '    <a href="' . tep_href_link(FILENAME_CONTACT_US) . '">' . MODULE_BOXES_INFORMATION_BOX_CONTACT . '</a>' .
              '  </div>' .
              '</div>';

      $oscTemplate->addBlock($data, $this->group);
    }

CSS 代码如下：
在stylesheet.css 文件末尾加入如下代码 即可修改显示效果
 

#infobox｛｝
#infobox  .infoBoxHeading｛｝
#infobox  .infoBoxContents｛｝