改造人間サスケのブログ一覧

マウスカーソルをリンクされた場所へ移動させても、通常では背景色の変化はない。

そこで、スタイルシートのカスタマイズ[上級者用]のプログラム変更箇所がないか？探ってみた。

何とか見つけることができたので、その方法を紹介します。
※一応テストをした結果、問題なく動作はしています。

hoverプログラムを探し色を指定する。

※「みんカラ」ヘッダータイトルオリジナルスタイル化

※スタイルシートでオリジナル背景の登録方法

を一読された上で実施されますようにお願い致します。

もう既にお読みの方は、ここから以降へ！

スタイルシートのカスタマイズ[上級者用]のスタイル１ないしはスタイル２を選択（ラジオボタン）し「スタイル編集」ボタンをクリックします。

表示されたプログラムの中に下記記述に似た内容のプログラムを探し、赤文字部分を追記します。

============================================

a:hover
{
color: #FF639A;
text-decoration: underline;
background: #000099; ←---この行を追加記述
}

============================================

※背景色#ffffff(RGB値／カラーネームコード）をお好みの色に指定してください。

また、次の記述でも問題なく動作することを確認した。
background-color: #FFFFFF;

※RGB値とは「#○○○○○○」（シャープ記号＋６桁の半角英数字のこと）
RGB値はここで確認できます。（参考）


※カラーネームコードとは「直接英語で色を指定すること」
　「"red"」など直接半角英文字で色指定。
カラーネームコードはここで確認できます。（参考）

色指定が済んだら、登録する前に一度プレビューで確認してからされることをお勧めいたします。

ちょっとややこしいですが、頑張ってチャレンジしてみてはいかがですか？

それなりの疲労感、満足度を味わえると思います。･･･ふぅー

スタイルシートのカスタマイズで背景色、背景画像を入れた場合にブログ内容が見づらくなるなどの弊害をなくすにはブログボディエリアに色を指定するしかないが、どこへ何を指定していいかわからず困る。

そこで、いろいろテストをした結果問題なく動作した内容で解説します。

ブログボディに色を指定するには

※「みんカラ」ヘッダータイトルオリジナルスタイル化

※スタイルシートでオリジナル背景の登録方法

を一読された上で実施されますようにお願い致します。

もう既にお読みの方は、ここから以降へ！

スタイルシートのカスタマイズ[上級者用]のスタイル１ないしはスタイル２を選択（ラジオボタン）し「スタイル編集」ボタンをクリックします。

表示されたプログラムの中に下記記述に似た内容のプログラムを探し、赤文字部分を追記します。

============================================

.BlogBody
{
padding: 2px 0 0px;
line-height: 130%;
word-break: break-all;
background: #ffffff; ←---この行を追加記述
}

============================================

※背景色#ffffff(RGB値／カラーネームコード）をお好みの色に指定してください。

また、次の記述でも問題なく動作することを確認した。
background-color: #FFFFFF;

※RGB値とは「#○○○○○○」（シャープ記号＋６桁の半角英数字のこと）
RGB値はここで確認できます。（参考）


※カラーネームコードとは「直接英語で色を指定すること」
　「"red"」など直接半角英文字で色指定。
カラーネームコードはここで確認できます。（参考）

色指定が済んだら、登録してアクセスして確認します。

ちょっとややこしいですが、頑張ってチャレンジしてみてはいかがですか？

それなりの疲労感、満足度を味わえると思います。･･･ふぅー

背景画像のオリジナルカスタマイズにチャレンジしてみた。
スタイルシートがもともと標準でいくつか用意されてはいるものの私の好みのものが見当たらなかったので、思い切ってカスタマイズにチャレンジすることにした。

最初は戸惑う場面もあったが、何とかできたのでそのやり方を紹介します。

スタイルシートからカスタマイズ [ 上級者用 ]にあるスタイルシート用画像にページを追加し、あらかじめ用意していた背景画像を登録する必要がある。

そのやり方は、まずスタイルシートを選択しスタイルシートのカスタマイズ[上級者用]にある「スタイルシート用画像」ボタンを選択する。

「ページ追加ボタン」をクリックしタイトル名に「背景」と入力した。
タイトルは好きな名前を入力することが可能だ。

次に「参照ボタン」をクリックし、あらかじめ用意している背景データ（JPG、GIF）などの画像データを選択。
<登録する背景データは容量がでかくならないように注意>

コメントは記入しなくてもいいようだ。
今回私の場合はコメント欄にクローバー（黒）と入力した。
※同一タイトル内で最大８つのスタイルシート用の画像が登録できるようになっている。

ここまで、できたら最下部の「登録」ボタンをクリックする。

画像登録完了後アドレスが表示されるので、そのアドレスをトリプルクリックしアドレス領域が選択されたらマウスの右クリックでコピー。

スタイルシート用画面を閉じスタイルシート画面のカスタマイズ[ 上級者用 ]にある「カスタマイズ１」のラジオボタンをオンにして「スタイル編集」ボタンをクリック。

スタイル編集画面（何やらプログラムがお目見えします）が表示され、左上のドロップダウンリストより好みの色を選択。
そのプログラムのヘッダー部に関する情報を一部変更する。
私の場合は「ドロップダウンリストよりブラック」を選択

次に「読み込み」ボタンをクリック。
「選択したスタイルを編集エリアを読み込みますか?」と問いかけてきますので「OK」ボタンをクリック。
すると表示されているプログラムが変更されてくる。

既に上記記載（オレンジ色）を登録されている方は、その作業は省いてください。
もし、誤ってその作業を行った場合は過去に登録されたスタイルシートが標準シートに変更されてしまいます。

表示されているプログラムの上から10行目を変更することで背景をオリジナルスタイルにできる。

プログラム変更方法について
表示されているプログラムの上から10行目にある
background: #000000;　　　←この部分を先程コピーした内容のアドレスに変更する。

しかし、注意が必要だ。

※下のようになるようにその行の先頭からプログラムを変更し、下の赤色部分になるところに先程登録したアドレスを右クリックしショートカットメニューから貼り付けで変更する。
background-image: url('https://cdn.snsimg.carview.co.jp/carlife/images/UserCarPhoto/････/･･･');

=============================================================================
/*
BLACK
*/

body
{
color: #cccccc;
padding-right: 2px;
padding-left: 2px;
background: #000000;　　　　　←---<"この赤色部分---上から10行目">
padding-bottom: 2px;
margin: 0px;
padding-top: 8px;
text-align: center;
}
=============================================================================

今回私の場合は、クローバー画像データを登録してみた。

アドレスの書き換えができたら、下部にある「保存」をクリックすると即反映されてしまうので、左隣にある「プレビュー」ボタンでまずは確認したほうが賢明である。

スタイル編集が終了したら、「選択したスタイルに変更」ボタンをクリックすることでオリジナルスタイルに変更ができた。

この要領で「カスタマイズ２」も登録することができる。

少し時間がかかるが、見た目の印象がよくなることは間違いがないのでやっただけの価値はあるのでは・・・と個人的には思います。

いい忘れましたが、背景画像データはなるべく容量を小さくするように！
見に来る方にストレスなく表示できる為、最低限のマナーは抑えていた方がよいと思います。大きなサイズにならないように！！

■背景色の変更だけでしたら、ストレスなく表示できます。■

背景色の変更方法
background: #000000;　　　　　←---<"この赤色部分---上から10行目">
の#000000（RGB値/カラーネームコード）を変更することで変えることが可能です。

また、次の記述でも問題なく動作することを確認した。
background-color: #FFFFFF;

※RGB値とは「#○○○○○○」（シャープ記号＋６桁の半角英数字のこと）
RGB値はここで確認できます。（参考）


※カラーネームコードとは「直接英語で色を指定すること」
　「"red"」など直接半角英文字で色指定。
カラーネームコードはここで確認できます。（参考）

追記）今回は「ドロップダウンリストよりブラック」での作業で実施した結果を元に操作説明しているので、他の色を選択した場合はプログラムの行数や内容が多少変更されてくる為、同様のプログラムを探し出すことで対応をお願いします。

もっと簡単にオリジナルカスタマイズが可能になればいいと思いますが、今後に期待したいと思います。

この紹介記事でドンダケ時間かけたか?もう疲れてきました。
みなさん、参考にして下されば幸いです。

ヘッダー部タイトルのオリジナルカスタマイズにチャレンジしてみた。
スタイルシートがもともと標準でいくつか用意されてはいるものの私の好みのものが見当たらなかったので、思い切ってカスタマイズにチャレンジすることにした。

最初は戸惑う場面もあったが、何とかできたのでそのやり方を紹介します。

スタイルシートからカスタマイズ [ 上級者用 ]にあるスタイルシート用画像にページを追加し、あらかじめ用意していた750*70（ピクセル）を登録する必要がある。

タイトルは好きな名前を入力し750*70ピクセル画像（JPG）を登録する。コメントは記入しなくてもいいようだ。
※同一タイトル内で最大８つのスタイルシート用の画像が登録できるようになっている。

画像登録完了後アドレスが表示されるので、そのアドレスをトリプルクリックしアドレス領域が選択されたらマウスの右クリックでコピー。

スタイルシート用画面を閉じスタイルシート画面のカスタマイズ[ 上級者用 ]にある「カスタマイズ１」のラジオボタンをオンにして「スタイル編集」ボタンをクリック。

スタイル編集画面（何やらプログラムがお目見えします）が表示され、左上のドロップダウンリストより好みの色を選択。
そのプログラムのヘッダー部に関する情報を一部変更する。
私の場合は「ドロップダウンリストよりブラック」を選択。

次に「読み込み」ボタンをクリック。
「選択したスタイルを編集エリアを読み込みますか?」と問いかけてきますので「OK」ボタンをクリック。
すると表示されているプログラムが変更されてくる。

自動変更されたプログラムの上から155行目のurl（アドレス）を変更することでタイトルをオリジナルスタイルにできる。
下記赤色部分をマウスで範囲選択し、先程コピーしたアドレスをマウスの右クリックから貼り付けし変更した。

※背景画像のカスタマイズプログラム変更方法について
　background-image: url('>/styles/black/point.gif'); ←----"上から155行目"この赤文字部分を変更する。

「参考」
　カッコ( )内のクォーテーション'で挟み込まないでも問題なく動作した。

==================================================
#Header
{
padding:15px;
margin-top: 5px;
background: #353535;
margin-bottom: 0px;
width: 750px;　　　　　　　　　　　　　　　　　　　　　　　　←----"ヘッダタイトル横幅（750ピクセル）"
height: 70px;　　　　　　　　　　　　　　　　　　　　　　　　 ←----"ヘッダタイトル高さ（ 70ピクセル）"
background-image: url('>/styles/black/point.gif'); 　　　　　　←----"上から155行目"
}
==================================================

アドレスの書き換えができたら、下部にある「保存」をクリックすると即反映されてしまうので、左隣にある「プレビュー」ボタンでまずは確認したほうが賢明である。

スタイル編集が終了したら、「選択したスタイルに変更」ボタンをクリックすることでオリジナルスタイルに変更ができた。

この要領で「カスタマイズ２」も登録することができる。

追記）今回は「ドロップダウンリストよりブラック」での作業で実施した結果を元に操作説明しているので、他の色を選択した場合はプログラムの行数や内容が多少変更されてくる為、同様のプログラムを探し出すことで対応をお願いします。

少し時間がかかるが、見た目の印象がよくなることは間違いがないのでやっただけの価値はあるのでは・・・と個人的には思います。
もっと簡単にオリジナルカスタマイズが可能になればいいと思いますが、今後に期待したいと思います。

この紹介記事でドンダケ時間かけたか?もう疲れてきました。
みなさん、参考にして下されば幸いです。

アルミ、タイヤのマッチングなかなか難しく高い買い物をしたのにきちんと収まらなかったり本当に難しいですよね?
私も何度となく買い替えしたりして、出費して家計が大変です。
何か、いい方法がないかいろいろ探してみました。
アルミマッチングデータ見つけました。
みなさんも、参考になさってみてください。
※車種別アルミマッチングデータ

※Normal（195/65-15）に対し、フロント（215/45-17）・リア（235/45-17）のタイヤを履いた場合どうなるか？
「インチアップ」　「面一」　「タイヤ」　「アルミ」　「条件」
※インチアップの基礎講座