ヤプログ・記事を囲う枠線を変える 長靴猫...★ 旧オロルンのヤプログ講座





↓--------

スポンサーサイト

 スポンサー広告



上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。


↓2005-09-20

ヤプログ・記事を囲う枠線を変える

 ヤプログ講座



記事を囲う枠線の部分を変えます

スタイルシートをいじります
いまからカスタマイズに入るので、バックアップを取って、メモ帳に移した状態にしてください
参考→カスタマイズの基礎
ピンク色のスキン(他の色でも問題ナシ)は最初、スタイルシートの真ん中より上あたりに

.entry
{
BORDER-RIGHT: #f99 1px solid;
BORDER-TOP: #f99 1px solid;
MARGIN: 10px;
BORDER-LEFT: #f99 1px solid;
BORDER-BOTTOM: #f99 1px solid;
width: 380px;
}

と言うタグが入ってます。これは記事を囲む枠を設定していて、

BORDER-RIGHT: #f99 1px solid;
→右側の枠線の設定をする行

BORDER-TOP: #f99 1px solid;
→上側の枠線の設定をする行

MARGIN: 10px;
→上下左右の余白の設定をする行

BORDER-LEFT: #f99 1px solid;
→左側の枠線の設定をする行

BORDER-BOTTOM: #f99 1px solid;
→下側の枠線の設定をする行

width: 380px;
→横幅の設定をする行

となっています。

★線の色の変え方
#???という部分を変えます。#???という文字を削除して、同じ部分に好きなカラーコードやカラーネームを入れてください。
参考→カラーコードとカラーネーム

例:BORDER-RIGHT: #f99 1px solid;
   ↓
  BORDER-RIGHT: #000000 1px solid;

★線の太さの変え方
?pxというところを変えます。pxはcmなどと同じように幅を表す単位で、省いてはいけません

例:BORDER-RIGHT: #f99 1px solid;
   ↓
  BORDER-RIGHT: #f99 10px solid;

★線の形状の変え方
英単語(solid)の部分を変えると点線とかの違う形状になります。入れる言葉にはいくつか種類があります

solid:普通の線
dotted:ドットの線
dashed:破線
double:二重線
groove:凹線
ridge:凸線
none:線ナシ

が主な例です(他にも数個あります)。doubleは、2か3px以上でないと2重線になってくれないので注意です

例:BORDER-RIGHT: #f99 1px solid;
    ↓
  BORDER-RIGHT: #f99 1px dotted;

★線をなくす
線のタグを消します。
例:
.entry
{
BORDER-RIGHT: #f99 1px solid;
BORDER-TOP: #f99 1px solid;
MARGIN: 10px;
BORDER-LEFT: #f99 1px solid;
BORDER-BOTTOM: #f99 1px solid;
width: 380px;
}

     ↓

.entry
{
MARGIN: 10px;
width: 380px;
}




講座の目次


上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。