とらんちょのブログ一覧

・スクロールバーの色を変更

スタイルシート内の body の中に以下の行を追加します。

/* スクロールバー色変更 */
scrollbar-base-color: aqua;
scrollbar-arrow-color: red;

１行目はスクロールバー全体の色、
２行目はスクロールバーの両端の三角の色。

色はカラー１、カラー２で参考にしてください。

※カラー１は Windows と Macintosh の共通の２１６色です。

例えばアクア色なら
scrollbar-base-color: aqua;
もしくは
scrollbar-base-color: #00ffff;


追加した例

body
{
background: #ffffff;
text-align: center;
margin: 0 0 0 0;
padding: 8px 2px 2px 2px;

/* スクロールバー色変更 */
scrollbar-base-color: aqua;
scrollbar-arrow-color: red;
}


細かく設定する時は

scrollbar-3dlight-color:
scrollbar-darkshadow-color:
scrollbar-shadow-color:
scrollbar-face-color:
scrollbar-highlight-color:

等があります。
変更したい場合は付け足してください。

---

・テキストフォントの変更

文字の書体を変更できます。

フォント変更のスタイルシートは

font-family: 総称ファミリ,"書体";

です。

総称ファミリは５種類。

sans-serif　　 ゴシック体
serif　　　　　明朝体
monospace　　　固定幅フォント
fantasy　　　　装飾系のフォント
cursive　　　　手書き風（筆写体・筆記体）

書体は複数あります。

HG行書体
ＭＳ 明朝

など。詳しくは font-family を説明してるサイトで。

World Wide Web Guide　「font-family」

例）
font-family: cursive,"HG行書体";

・タイトルのフォントを変更するには .BlogTitle に font-family: を追加します。

追加してみた例。
.BlogTitle
{
color: #EEEEEE;
font-weight: bold;
font-size: 20px;
font-family: cursive,"HG行書体";
}

・ページ全部のフォントを変更するには以下の１０行をどこでもいいので追加。
（変更されない所もたぶんあり。その場合は調べて追加することに）

body,
.BlogTitle,
#BlogMenu,
#Content,
.BlogDate,
.Title,
.BlogText
{
font-family: cursive,"HG行書体";
}

---

・サイドメニューにある「サイト検索」の色変更

サイト検索の入力欄の色を変更または画像を入れれます。

・入力欄の色変更はどこでもいいので以下の行を追加。

/* サイト検索色変更 */
.mc_user_vivisimo input
{
background-color: blue;
}

色はカラー１、カラー２で参考にしてください。

※カラー１はWindowsとMacintoshの共通の２１６色です。


・入力欄に画像を入れたい場合はどこでもいいので以下の行を追加。

/* サイト検索入力欄画像表示 */
.mc_user_vivisimo input
{
background: url(http://carview.r3h.net/～.jpg);
}

http://carview.r3h.net/～.jpg は画像のアドレスを入れてください。


・入力欄とボタンの周りに色を付けたい場合は以下の行を入れてください。

border: solid 1px green;

1px は色の太さ。


追加例）

/* サイト検索色変更 */
.mc_user_vivisimo input
{
border: solid 1px green;
background-color: blue;
}

---

・何シテル？に枠の表示

・プロフィール画像の下に「何シテル？」を表示したときに枠を表示することができます。

表示する場合はどこでもいいので以下の行を追加。

/* 何シテル？枠表示 */
.ProfileBalloon
{
border-width: 1px; border-color: skyblue; border-style: solid;
color: white;
}

1px は枠の太さ。
skyblue は枠の色。#87ceeb でもいいです。
color: white; は文字の色。無くてもいいです。
色はカラー１、カラー２で参考にしてください。

※カラー１はWindowsとMacintoshの共通の２１６色です。

solid は枠の形式。
他に
dotted　dashed　groove　ridge　double　inset　outset
がありますが見た感じは solid がいいみたいです。

---

・2008.06.04 以降にスタイルシートを新たに設定すると
「プロフィールページ関連」の所に「プロフィール：ふきだし」が
追加されてるのでそこを変えると枠ではなく色を塗りつぶしになります。
枠ではなく塗りつぶしたい場合は以下を変更、もしくは追加。

/*プロフィール：ふきだし*/
.ProfileBalloon
{
background-color: #C0D0F0;
color: white;
}

background-color: #C0D0F0; はバックの色。
color: white; は文字の色、標準では無いので追加。

---

・バックを色ではなく画像を背景にしたい場合は以下を追加。

background: url(http://carview～.jpg) repeat;

http://carview～.jpg は画像のアドレス。

例）
/* 何シテル？枠画像表示 */
.ProfileBalloon
{
border-width: 1px; border-color: skyblue; border-style: solid;
color: white;
background: url(http://carview～.jpg) repeat;
}



スタイルシートメニュー

・サイドメニュー下にある「ＱＲコード」の消し方

スタイルシートのどこでもいいので以下の行を追加。
一番上に入れてもいいです。

/* ＱＲコード消し */
#BlogMenu img,
#BlogMenu span
{

}

#BlogMenu .MenuPlate img,
#BlogMenu .MenuPlate span
{
display: inline;
}

---

・サイドメニューにある「ＰＲの画像」の消し方

注）2008.12.4 の機能変更の為に削除できなくなりました。

注）利用規約に引っかかると思われるので自己責任でお願いします。



スタイルシートのどこでもいいので以下の行を追加。
一番上に入れてもいいです。

/* ＰＲ画像消し */
#BlogMenu iframe
{
height: 0;
}

---

・サイドメニューにある「サイト検索」の消し方

スタイルシートのどこでもいいので以下の行を追加。
一番上に入れてもいいです。

/* サイト検索消し */
.mc_user_vivisimo input
{

}

---

・スポンサーサイトの消し方

注）2008.12.4 の機能変更の為に削除できなくなりました。

注）利用規約に引っかかると思われるので自己責任でお願いします。


スタイルシートのどこでもいいので以下の行を追加。
一番上に入れてもいいです。

/* スポンサーサイト消し */
#adContainer td
{

}

---

・｢ＰＲの画像｣ ｢サイト検索｣ ｢スポンサーサイト｣ の消し方

注）2008.12.4 の機能変更の為に削除できなくなりました。

注）利用規約に引っかかると思われるので自己責任でお願いします。


上の３つを同時に消す場合。（上の３つを入れたのと同じです。）
スタイルシートのどこでもいいので以下の行を追加。
一番上に入れてもいいです。

/* ＰＲ画像・サイト検索・スポンサーサイト消し */
.MenuPlate_ iframe,
.mc_user_vivisimo input,
#adContainer td
{
height: 0;

}

---

・サイドメニューの「サイト検索」の所に画像の表示の仕方

スタイルシートのどこでもいいので以下の行を追加。
一番上に入れてもいいです。

/* サイト検索画像表示 */
.mc_user_vivisimo
{
padding-top: 60px;
background: url(画像ファイルＵＲＬ) no-repeat center top;
}

画像の大きさによって表示が違うので少し変更が必要です。

padding-top: 60px;　の 60px の数字を変えてください。

表示する画像の大きさは横が 190px までにしてください。
大きすぎるとメニューがブログの下にいってしまいます。

画像ファイルＵＲＬには画像のアドレスを入れてください。

https://cdn.snsimg.carview.co.jp/carlife/～.jpg　みたいな。

---

・メインメニューの下に画像表示

メインメニュー（ブログ・愛車紹介・おすすめスポット・My掲示板）の下に
画像を表示出来ます。

スタイルシート内の .TabBottom の所の

.TabBottom
{
background-color: #95A8D2;
text-align: center;
height: 5px;
}

の３行を削除して以下の行に書き換えてください。

.TabBottom
{
padding-top: 30px;
background: url(https://cdn.snsimg.carview.co.jp/～.jpg) no-repeat center top;
}

padding-top: 30px; で表示する画像の高さを設定します。
画像を沢山（リピート）する場合は no-repeat を消してください。



スタイルシートメニュー

日曜日に行けなかったあやしいイベントに行ってきました。

昼まで寝てて「いいとも♪」を観終わった後にお出かけを。

イベントに行ってきたのですが去年とあまり変わらず見慣れた車ばかり・・・
まぁ入場料タダってことでこんなもんかと。

写真もフォーミュラカーの２台だけしか撮りませんでした。

帰りに車で信号待ちをしてるとドアミラーから見える見覚えのある厳つい３４が・・・
横に並ぶとozぁさんでした（笑）

ozぁさんもあやしいイベントを観てきたんだとか。

その後また会社に行って３時間ほど仕事を（疲）
折角の連休なのに仕事ばかり・・・

来週はＦ１があるけど行ってみたいなぁ。
だけどバスは嫌だなぁ・・・