＠風来坊のブログ一覧

○タブ
投稿記事上部に表示されるコンテンツ選択用タブに関する設定です。

・タブ
ul#MainNav

実際の基本記述
width:100%;
list-style-type:none;
margin:10px 0;
padding:0px;
clear:both;
height:30px;
float:left;


・タブ(通常)のスタイル
ul#MainNav li.nav

実際の基本記述
font-size:12px;
width:19.5%;
height:30px;
float:left;
display:block;
text-align:center;
background:#eeeeee;
margin:0 0.6% 0 0;
line-height:2.5;


・タブ(通常)のリンク
ul#MainNav li a

実際の基本記述
color:#333;
display:block;
height:30px;


・タブ(通常)のリンク(訪問済み)
ul#MainNav li a:visited

実際の基本記述
color:#333;


・タブ(通常)のリンク(マウスオーバー)
ul#MainNav li a:hover

実際の基本記述
background:#ffd700;
color:#333;


・タブ(選択中)のスタイル
ul#MainNav li.navOn

実際の基本記述
background:#ffd700;
color:#333;


・タブ(選択中)のリンク
ul#MainNav li.navOn a

実際の基本記述
color:#333;


・タブ(選択中)のリンク(訪問済み)
ul#MainNav li.navOn a:visited

実際の基本記述
color:#333;


・タブ(選択中)のリンク(マウスオーバー)
ul#MainNav li.navOn a:hover

実際の基本記述
color:#333;


・右端のタブ
ul#MainNav li.navEnd

実際の基本記述
width:19.4%;
margin:0px;

○変更箇所表記の意味
削除…青
変更…緑
追記…赤

○ページの基本

・ページBody（禁止プロパティ:width、height、margin、padding）
（ナビゲーション上部にも背景色を設定するには、background-colorプロパティで背景色を設定してください。）
body

基本記述
text-align:center;
font-size:14px;
line-height:1.5;
color:#222222;
font-family:'ＭＳ Ｐゴシック',Hiragino Kaku Gothic Pro,sans-serif;
background-color:#ffffff;

変更後
text-align:center;
font-size:14px;
line-height:1.5;
color:#222222;
font-family:'ＭＳ Ｐ明朝','ＭＳ Ｐゴシック',Hiragino Kaku Gothic Pro,sans-serif;
background-image:url('https://cdn.snsimg.carview.co.jp/carlife/images/UserCarPhoto/1368690/p3.jpg');
background-repeat:no-repeat;
background-attachment:fixed;
background-position:center;
background-color:transparent;

ＭＳ Ｐ明朝体の追加
背景色「白」から背景画像へ変更
背景画像の繰り返しを無しに変更
背景画像をスクロールしないように変更
背景画像の透過処理

・リンク
a

基本記述
color:#1e89bb;


・リンク(訪問済み)
a:visited

基本記述
color:#12516e;


・リンク(マウスオーバー)
a:hover

基本記述
color:#daa520;
text-decoration:none;


・ユーザー領域（禁止プロパティ:width、height、margin、padding）
（display:blockが追加または設定されます。）
div#MinkaraBody

基本記述
clear:both;
background-color:#ffffff;
display:block;

変更後
clear:both;
background-color:transparent;
display:block;

背景画像の透過処理

・ユーザー領域リンク
div#MinkaraBody a

基本記述
無し


・ユーザー領域リンク(訪問済み)
div#MinkaraBody a:visited

基本記述
無し


・ユーザー領域リンク(マウスオーバー)
div#MinkaraBody a:hover

基本記述
無し


・コンテンツ領域（禁止プロパティ:width、height、margin、padding）
div#BodyBlock

基本記述
text-align:left;


・コンテンツ領域リンク
div#BodyBlock a

基本記述
color:#1e89bb;


・コンテンツ領域リンク(訪問済み)
div#BodyBlock a:visited

基本記述
color:#12516e;


・コンテンツ領域リンク(マウスオーバー)
div#BodyBlock a:hover

基本記述
color:#daa520;
text-decoration:none;


・ヘッダー領域（禁止プロパティ:width、margin、padding）
（heightの値は50～290pxに制限されています(指定しない場合は50px)。）
（display:block、overflow:hiddenが追加または設定されます。）
div#BodyBlockHeader
上部にマージンを取る場合：ＸＸ px ＸＸ＝※0～10

基本記述
height:270px;
overflow:hidden;
float:left;
background-color:#ffd700;
display:block;
上部にマージンを取る場合：10 px ※0～10

変更後
height:232px;
overflow:hidden;
float:left;
background-color:#ffd700;
background-image:url('https://cdn.snsimg.carview.co.jp/carlife/images/UserCarPhoto/1368690/p1.jpg');
background-repeat:no-repeat;
display:block;
上部にマージンを取る場合：10 px ※0～10

ヘッダーを画像にする

・ヘッダータイトル
div#BodyBlockHeader h2

基本記述
line-height:100%;
font-size:24px;
margin:0;
width:930px;
padding-top:10px;
padding-right:0;
padding-bottom:0;
padding-left:10px;


・ヘッダータイトル色
div#BodyBlockHeader h2 a
div#BodyBlockHeader h2 a:visited

基本記述
color:#333333;

変更後
color:#ffffff;

ヘッダータイトル色を画像に合わせて「白」に変更

・ヘッダータイトル色(マウスオーバー)
div#BodyBlockHeader h2 a:hover

基本記述
color:#333333;
text-decoration:none;

ここの「みんカラ仕様」の説明にします。

各ブロック設定ごとに、
旧ＣＳＳは、

セレクタ {
　　　　　　プロパティ:値 ;
　　　　　　プロパティ:値 ;
　　　　　　…
　　　　 }

となっていたと思います。

新ＣＳＳは、

プロパティ:値 ;
プロパティ:値 ;
…

となっています。

実際の私の設定を使いながら説明していこうと思います。
簡易編集にて基本色イエローを詳細編集でみるとこうなります。
そこから、変更をした部分を追記しながら完成させていこうと思います。

(=´ー｀)ノ　ヨロシクです♪

◎スタイルシート詳細編集は、下記に分かれています。
○変更箇所表記の意味
削除…青
変更…緑
追記…赤


○ページの基本
更新日：２００９．０４．０９
変更点：
フォント→明朝体
背景画像→背景画像の固定、一面中央表示、透過表示処理
ヘッダー→画像に変更

○タブ
更新日：２００９．０４．０７

○コンテンツ共通
更新日：２００９．０４．１９
変更点：
本文背景などを元に戻す

○ブログ
更新日：２００９．０４．０７

○愛車紹介
更新日：２００９．０４．０７

○スポット/マイ掲示板
更新日：２００９．０４．０７

○コメント
更新日：２００９．０４．１９
変更点：
コメント背景などを元に戻す

○プロフィール
更新日：２００９．０４．０７

○サイドメニュー
更新日：２００９．０４．１９
変更点：
サイドメニュー背景などを元に戻す

○スタイルの操作
更新日：２００９．０４．０８


上記それぞれの大きな部分が更に細かく分かれています。
それを、実際の私のシートを使い、加工します。
追記は、リンク先に追記して、このブログとリンクさせます。

とりあえず始めてみますね。
私も、そんなに「わかる」方ではありませんので、間違いなどあればご訂正のコメントでも下さいませ
ペコリ(o_ _)ｏ))

どういう記述にすればいいのかまだ決まっていません。
タイトルにコマンド記載した方がいいのか、みんカラの詳細編集内の基本なども見出しにすればいいのか…。

このブログは、挨拶みたいなものなので日付を入れましたけど…
色々試行錯誤しながら書いていきたいと思います。