Responsive

Premium Responsive
環境 Drupal 7

Drupal 7 HTML5対応テンプレート responsiveResponsiveは、Drupal 7で稼働する、HTML5対応なテーマです。 

スクリーンショット
ダウンロード

http://drupal.org/project/responsive

インストール、設定

・通常のテーマインストール手順です。

備考

罫線の修正

標準の罫線を表(テーブル)を作成すると、表の左上とトップに黄色(#fff222)のラインが表示される。そのラインを変更すると、左上とトップは黒のラインになるが、他の箇所(セル)もボーダーを黒に設定する。

下記の内容は、いくつかのコメントがありますが、参考まで。編集ファイルは sites/all/themes/responsive/style.css

/* table {
  background: #ececec;
  border: 1px solid #fff222;
} */

table {
  background: #ececec;
/* border: 1px solid #fff222; */
  border: 1px solid #000000;
/*  border-top: none; */
*  border-left: 1px solid #ffffff; */ 

}

また、表(テーブル)の罫線を表示させたくない場合、各コンテンツごとに表現方法があるので、たとえば、そのコンテンツのソースに CSSの設定をするのも一つの方法です。

<style type="text/css">
table {
    border: none;
     }</style>

 

リスト記号をデフォルトから変更する

コンテンツの中で変更する場合

<style type="text/css">

ul { list-style-image: url(mark.gif); }

</style>

もしくは、CSSファイルを編集する  sites/all/themes/reponsive/style.cssで アイテムリストのULを画像に変更すると、最近のブログのブロックで表示されるリスト記号が変更になります

.item-list ul {
  margin: 0;
  padding: 0 0 0 1.5385em;

list-style-image: url(/sites/default/files/img/icon/point/point027_08.png);

}

 

スライドショー(FlexSlider)のスライドを3イメージから増やす方法

sites/all/themes/responsive/templatesのpage.tpl.phpで修正します。まだ、動作未確認ですが。

IEでの表示トラブル

IEの場合は、メニューがあるヘッダーとスライドショウの空間でmargin-bottomを使っており、その影響で表示動作がおかしい場合があります。 その場合、padding-bottomに変更します。編集は style.cssです。

お役立ち情報

 

 

オープンソースソフトウェア: 

CMS: