So-net無料ブログ作成
メッセージを送る

kuu♪からのお知らせ

■スキンを作るコツは、とにかくプレビューで確認することです。
 数字を替えた! 色を替えた! 画像を替えた!そのたびにプレビュー! で確認!
 そしてこまめに保存してください。

■コメントをたくさんいただいているのですが返信もままならない状況ですのでしばらくの間コメントの受付を停止させていただきます。ごめんなさい。

また、管理人kuuがしばらくソネブロを離れている間に随分仕様の変更等あったみたいですので、当ブログの記述では対応できないものも出ているかもしれません。
カレンダー ブログトップ

カレンダーの更新した日付部分の画像を変えよう [カレンダー]

【カレンダーの更新した日付部分の画像を変えよう】

カレンダー01.PNGやじるし2.GIFカレンダー02.PNG

 

カレンダーの画像サイズは、24×24くらいまでがいいと思います。  
 
変える部分を で書いています。


 

/*--Calendar--*/ とあります。その中の

#calendar td.link {
background:#d0ceb7;
font-weight:bold;
}

を変えます。

変えたタグ〔見本〕

#calendar td.link {
background:url(/blog/_images/blog/_▲▲▲/*****/0123456.gif) no-repeat center center;
background-color:#C8DDFF;
font-weight:bold; }

 

①画像を入れます
background:url(/blog/_images/blog/_▲▲▲/*****/0123456.gif) no-repeat center center;
カレンダー04.PNG


②背景の色を変えます
background-color:#C8DDFF; の #C8DDFF をお好きな色に変えてください。
カレンダー02.PNG

用意した画像が透過してない写真とかであれば②は必要ありません。
色の載せ方は、 【基本の背景色を変えよう】に記述してあります。

③背景色を消し、枠をつける場合は
background-color:#C8DDFF;を消し、
border:1px solid #9a9a9a; を付け加えます。
カレンダー03.PNG


nice!(4)  コメント(0) 
共通テーマ:blog

カレンダーを装飾してみよう [カレンダー]

どこに入れると、どうなるのか を書いてあります。

カレンダーの更新した日付部分の画像を変えよう
よく出てくるタグの説明
とあわせて参考にしてください。


.calendar-date {
text-align:center;
 border: 1px solid #FF0000; background:#FF0000;
 Calendar-01.PNG Calendar-02.PNG
 .calendar-date {
text-align:center;
border: 1px solid #FF0000;
}
 .calendar-date {
text-align:center;
background:#FF0000;
}

#calendar table {
margin:3px auto;
text-align:center;
}
 border: 1px solid #FF0000; background:#FF0000;
 Calendar-03.PNG Calendar-04.PNG
 #calendar table {
margin:3px auto;
text-align:center;
border: 1px solid #FF0000;
}
 #calendar table {
margin:3px auto;
text-align:center;
background:#FF0000;
}

#calendar th {
height:21px;
width:21px;
font-weight:normal;
}
 border: 1px solid #FF0000; background:#FF0000;
 Calendar-05.PNG Calendar-06.PNG
 #calendar th {
height:21px;
width:21px;
font-weight:normal;
border: 1px solid #FF0000;
}
 #calendar th {
height:21px;
width:21px;
font-weight:normal;
background:#FF0000;
}

#calendar td{
height:21px;
width:21px;
font-size:10px;
line-height:1;
}
 border: 1px solid #FF0000; background:#FF0000;
 Calendar-07.PNG Calendar-08.PNG
 #calendar td{
height:21px;
width:21px;
font-size:10px;
line-height:1;
border: 1px solid #FF0000;
}
 #calendar td{
height:21px;
width:21px;
font-size:10px;
line-height:1;
background:#FF0000;
}

#calendar td.link {
background:url(/_common/skins/19/images/cal_active.gif) no-repeat center center;
font-weight:bold;
}
 border: 1px solid #FF0000; background:#FF0000;
 Calendar-09.PNG Calendar-10.PNG
 #calendar td.link {
background:url
(/_common/skins/19/images/cal_active.gif)
no-repeat center center;
font-weight:bold;
border: 1px solid #FF0000;
}
#calendar td.link {
background:url
(/_common/skins/19/images/cal_active.gif)
no-repeat center center;
font-weight:bold;
background:#FF0000;
}
 
 background-color:#FF0000; 
 Calendar-11.PNG 
 #calendar td.link {
background:url
(/_common/skins/19/images/cal_active.gif)
no-repeat center center;
font-weight:bold;
background-color:#FF0000;
}
 
 


 


nice!(7)  コメント(4) 
共通テーマ:blog
カレンダー ブログトップ

ありがとうございます♪♪

記事が役に立たれたら、下のバナーの興味があるものをクリックしてもらうとうれしいです。

  

         

この広告は前回の更新から一定期間経過したブログに表示されています。更新すると自動で解除されます。

×

この広告は1年以上新しい記事の更新がないブログに表示されております。