ニュース更新ツールの一覧ページについて (No. 195)

質問

ニュース更新ツールを使用させていただいています。
一覧ページの仕切り線の「色」「太さ」を変更する方法
を教えていただけますでしょうか。
よろしくお願い致します。

回答

実装の方法には色々な選択肢があると思いますが、一例をご紹介します。

■ニュース更新ツールのサンプルサイトの場合

◇URL
http://sugutsukaeru.jp/sample/P003-G0-A0/index.html

◇区切り線の表示方法

このページでは区切り線をセルの背景画像で表示しています。

以下のコードの部分が該当します。

<TD COLSPAN="2" BACKGROUND="../image/line_01.gif"><!-- スペーサ省略 --></TD>

◇色と太さの変更方法

背景画像を編集して変更します。

上記例だと ../image/line_01.gif の画像ファイルを編集します。

背景画像はセルの中身がある部分に縦横に繰り返されて表示されますので、TDの height が仕切り線の太さより高くなるように（＝区切り線の太さ全部が見えるように）、また、画像の高さ以下になるように（＝縦方向に繰り返し表示されてしまわないように）調整して下さい。

HTMLコードを変更するには templates/article/artice_list.txt を編集して下さい。

■携帯対応ニュース更新ツールのサンプルサイトの場合

◇URL
http://sugutsukaeru.jp/sample/P003-G0-A0-CS-ALJA-ULJA-AM1-UM0/index.html

◇区切り線の表示方法

このページでは区切り線を <hr> タグで表示しています。

◇色と太さの変更方法

templates/article/artice_list.txt の 1 行目の <hr> タグを変更します。

下記は「太さを 10px、色を #00cc00」に変更するコードの例です。

<hr style="height: 10px; background-color: #00cc00">

この他、下記の書き方でもほぼ同じ表示になります。

<hr size="10" color="#00cc00">