• 車種別
  • パーツ
  • 整備手帳
  • ブログ
  • みんカラ＋
■ナビゲーション
  1. 車・自動車SNSみんカラ
    2. >
  2. ブログ
    3. >
  3. ブログ一覧 [ちびまる商店 店主]

ちびまる商店 店主のブログ一覧

2009年04月12日 イイね！

スタイルシート弄り　背景の透過

スタイルシート弄りの記録として背景透過についてアップします！
（※みんカラブラックをベースに弄っています）

スタイルシートの詳細設定画面には以下の分類があります。

ページの基本　タブ　コンテンツ共通　ブログ　プロフィール　愛車紹介
　スポット/マイ掲示板　コメント　サイトメニュー


■まずは「タブ」部分の「タブ(通常)のスタイル」です。
　
font-size:12px;
width:19.5%;
height:30px;
float:left;
display:block;
text-align:center;
background:#666;　← ここを
margin:0 0.6% 0 0;
line-height:2.5;

↓

font-size:12px;
width:19.5%;
height:30px;
float:left;
display:block;
text-align:center;　
background-image:url(https://cdn.snsimg.carview.co.jp/cvmaterials/minkara/user/css/034/bg.png);
background-repeat:repeat;　← このように変更します
margin:0 0.6% 0 0;
line-height:2.5;

すると↓この様になります(^^)/




■今度は「コンテンツ共通」部分の「コンテンツ表示」です。
　ここを弄ると、ブログやパーツレビューの背景が透過します。

margin:0px;
padding:10px 20px 8px 20px;
background:url(https://cdn.snsimg.carview.co.jp/cvmaterials/minkara/user/css/010/contents.gif) repeat-y;　← この下線部分を
width:580px;

↓

margin:0px;
padding:0px 0px 8px 0px;
background-image:url(https://cdn.snsimg.carview.co.jp/cvmaterials/minkara/user/css/034/bg.png);
background-repeat:repeat;　← この様に変更します
width:620px;

すると↓背景が透過しました(^^)/



■今度は「コメント」部分の「コメントテーブル」です。
　コメント部分全体の背景設定になります。

vertical-align:top;
background:#333;　← ここを

↓

vertical-align:top;
background-image:url(https://cdn.snsimg.carview.co.jp/cvmaterials/minkara/user/css/034/bg.png);　← この様に変更します
background-repeat:repeat;

■「コメントタイトル」部分
　名前が表示される部分です。

background:#333;　← この行を削除します
padding:8px 0 5px 10px;
font-weight:bold;
font-size:12px;

■「コメント日付」部分は、

background:#333;　← この行を削除
color:#999;
text-align:left;
padding-left:10px;
font-size:10px;
line-height:0.5;
font-family:Verdana;

■「コメント表示」部分
　コメント内容の表示部分です。

margin:5px;
background:#333;　← この行を削除します
padding:5px;
font-size:12px;
line-height:1.65;

すると↓スッキリします(^^)v




■「サイドメニュー」部分の「サイドメニュー領域」は、
　サイドメニュー部分の背景設定です。

width:300px;
padding-bottom:10px;
background:#333;　← ここを

↓

width:170px;
padding-bottom:10px;
float:right;
background-image:url(https://cdn.snsimg.carview.co.jp/cvmaterials/minkara/user/css/034/bg.png);
background-repeat:repeat;　← この様に変更します

すると↓この様に背景が透けて見えます(^^)v



■サイドメニュータイトル
　プロフィール・お友達・ファン・リンクといった見出し部分です。

font-size:12px;
padding:3px 0;
background:#222;　← ここを
color:#eee;
text-align:center;

↓

font-size:12px;
padding:3px 0;
background-image:url(https://cdn.snsimg.carview.co.jp/cvmaterials/minkara/user/css/034/bg.png);
background-repeat:repeat;　← この様に変更します
color:#eee;
text-align:center;

↓バッチリです(^_^)v


以上です。

最後までご覧頂き有難う御座いました。

※スペルミスが有ったので訂正しました（2011-09-01）
　backgronund-repeat: は
　background-repeat: の間違いです！(￣ェ￣;)

間違っている部分が有りましたらコッソリお知らせ下さい(^^;
Posted at 2009/04/12 21:32:28 | コメント(34) | トラックバック(0) | スタイルシート弄り | 日記

プロフィール

「花粉のせいで鼻水ダラダラ・・・　頭も痛い(T_T)」
何シテル？   03/02 23:06
時々自己満足な弄りをして楽しんでいるオヤジです（＾＾；）
みんカラ新規会員登録

ユーザー内検索

掲示板

ちびまる商店 店主の掲示板

<< 2009/4 >>

日 月 火 水 木 金 土
   1234
56 78 91011
121314151617 18
19202122232425
2627282930  

ブログカテゴリー

リンク・クリップ

[ルノー カングー] 3Mヘッドライトコーティング施工 
カテゴリ：その他（カテゴリ未設定）
2025/05/20 00:29:31
[ルノー カングー] 車検見積もり 
カテゴリ：その他（カテゴリ未設定）
2025/05/20 00:27:18
[ルノー カングー] エンジンオイル&エレメント交換 
カテゴリ：その他（カテゴリ未設定）
2025/05/20 00:04:01
[ 他のクリップをチェック ]

愛車一覧

日産 セレナ 日産 セレナ
H18年3月15日納車のライダーＳです。 ■メーカーオプション 　バイキセノンヘッドラ ...
[ 愛車一覧 ]

過去のブログ

2013年
01月02月03月04月05月06月
07月08月09月10月11月12月
2012年
01月02月03月04月05月06月
07月08月09月10月11月12月
2011年
01月02月03月04月05月06月
07月08月09月10月11月12月
2010年
01月02月03月04月05月06月
07月08月09月10月11月12月
2009年
01月02月03月04月05月06月
07月08月09月10月11月12月
2008年
01月02月03月04月05月06月
07月08月09月10月11月12月
2007年
01月02月03月04月05月06月
07月08月09月10月11月12月
2006年
01月02月03月04月05月06月
07月08月09月10月11月12月
ヘルプ｜ 利用規約｜ サイトマップ
© LY Corporation