アメブロ向上企画書ーCSSでカスタマイズ、オリジナルなスキンに挑戦! -295ページ目

CSS カレンダーをかわいく 6

サンプルの下にCSSをつけました

好きなカレンダー下にあるCSSを自分のCSSの最後にコピペするだけで

サンプルと同じになるはずです

マウスを当てたときの変化も確認できます・・・・


カレンダー№ が同じ物は違いは色だけです

慣れてきたら好きな色に変更下さい


設置できましたらコメントをいただけると助かります

皆様の実際どうなるのか参考になりますし

どのタイプが人気があるのか知りたいんで・・・・ m(_ _)m



カレンダー16



/*■■ カレンダー16 ■■*/
#calendar table {/*全体*/
color:#ffc0ff;/*文字色*/
font-weight:bold;/*太文字*/
font-size: 1.2em;/*文字サイズ*/
border: 2px #ff80ff solid;/*線の太さ 色 線種*/
border-collapse: collapse;
}
#calendar table caption a{/* <<と>> */
color:#ffffff;/*文字色*/
background-color:#ff80ff;/* セルの背景色 */
padding: 3px 15px 0;
}
#calendar table caption{/*月*/
color:#ffffff;/*文字色*/
background-color:#ff80ff;/* セルの背景色 */
padding: 3px 15px 0;
}
#calendar table th{
color:#ffffff;/*文字色*/
}
#calendar table td{/*日にち*/
border: 1px #ff80ff solid;/*線の太さ 色 線種*/
padding: 0;
}
#calendar table td a{/*記事のある日*/
color:#ff00ff;/*文字色*/
background-color: #ffccff; /* セルの背景色 */
text-decoration: none; /* リンク文字の下線消す */
display:block;
}
#calendar table td a:hover{/*マウスオーバー*/
color:#ffffff;/*文字色*/
background-color: #ff00ff; /* セルの背景色 */
}
#calendar table .sun {/*日曜*/
color:#ff4080;/*文字色*/
}
#calendar table .sat{/*土曜*/
color:#80ffff;/*文字色*/
}



カレンダー17



/*■■ カレンダー17 ■■*/
#calendar table {/*全体*/
color:#ff00ff;/*文字色*/
font-weight:bold;/*太文字*/
font-size: 1.2em;/*文字サイズ*/
border: 2px #ff00ff dotted;/*線の太さ 色 線種*/
border-collapse: collapse;
}
#calendar table caption a{/* <<と>> */
color:#ffffff;/*文字色*/
padding: 3px 15px 0;
}
#calendar table caption{/*月*/
color:#ffffff;/*文字色*/
background-color:#ff00ff;/* セルの背景色 */
padding: 3px 15px 0;
}
#calendar table th{
color:#ffffff;/*文字色*/
border: 1px #ff00ff dotted;/*線の太さ 色 線種*/
}
#calendar table td{/*日にち*/
border: 1px #ff00ff dotted;/*線の太さ 色 線種*/
padding: 0;
}
#calendar table td a{/*記事のある日*/
color:#ffccff;/*文字色*/
background-color: #ff00ff; /* セルの背景色 */
text-decoration: none; /* リンク文字の下線消す */
display:block;
}
#calendar table td a:hover{/*マウスオーバー*/
color:#ffffff;/*文字色*/
background-color: #ffccff; /* セルの背景色 */
}
#calendar table .sun {/*日曜*/
color:#ff4080;/*文字色*/
}
#calendar table .sat{/*土曜*/
color:#80ffff;/*文字色*/
}


カレンダー18



/*■■ カレンダー18 ■■*/
#calendar table {/*全体*/
color:#ffc0ff;/*文字色*/
font-weight:bold;/*太文字*/
font-size: 1.2em;/*文字サイズ*/
border-top: 1px #ff80ff solid;/*線の太さ 色 線種*/
border-left: 1px #ff00ff solid;/*線の太さ 色 線種*/
border-right: 1px #ff00ff solid;/*線の太さ 色 線種*/
border-bottom: 1px #ff00ff solid;/*線の太さ 色 線種*/
border-collapse: collapse;
}
#calendar table caption a{/* <<と>> */
color:#ff00ff;/*文字色*/
padding: 3px 15px 0;
}
#calendar table caption{/*月*/
color:#ff00ff;/*文字色*/
border-top: 1px #ff00ff solid;/*線の太さ 色 線種*/
border-left: 1px #ff00ff solid;/*線の太さ 色 線種*/
border-right: 1px #ff00ff solid;/*線の太さ 色 線種*/
padding: 3px 15px 0;
}
#calendar table th,
#calendar table td{/*曜日・日にち*/
border-bottom: 1px #ff80ff solid;/*線の太さ 色 線種*/
padding: 0;
}
#calendar table td a{/*記事のある日*/
color:#ff00ff;/*文字色*/
background-color: #ffccff; /* セルの背景色 */
text-decoration: none; /* リンク文字の下線消す */
display:block;
}
#calendar table td a:hover{/*マウスオーバー*/
color:#ffffff;/*文字色*/
background-color: #ff00ff; /* セルの背景色 */
}
#calendar table .sun {/*日曜*/
color:#ff4080;/*文字色*/
}
#calendar table .sat{/*土曜*/
color:#80ffff;/*文字色*/
}




CSS カレンダーに画像をつけてカレンダーらしく?

CSS カレンダーをかわいく

CSS カレンダーをかわいく 2

CSS カレンダーをかわいく 3

CSS カレンダーをかわいく 4

CSS カレンダーをかわいく 5

CSS カレンダーをかわいく 6

CSS カレンダーをかわいく 7

CSS カレンダーをかわいく 8

CSS カレンダーをかわいく 緑組応援団

CSS カレンダーをかわいく 5

サンプルの下にCSSをつけました

好きなカレンダー下にあるCSSを自分のCSSの最後にコピペするだけで

サンプルと同じになるはずです

マウスを当てたときの変化も確認できます・・・・


カレンダー№ が同じ物は違いは色だけです

慣れてきたら好きな色に変更下さい


設置できましたらコメントをいただけると助かります

皆様の実際どうなるのか参考になりますし

どのタイプが人気があるのか知りたいんで・・・・ m(_ _)m



カレンダー10



/*■■ カレンダー10 ■■*/
#calendar table {/*全体*/
color: #666666;/*全体の文字色*/
border: 1px #000000 solid;/*背景の色に合わせる*/
border-collapse: collapse;
}
#calendar table caption a,
#calendar table caption{/*月*/
color: #999999;/*文字色*/
background-color: #666666; /* セルの背景色 */
text-decoration: none; /* リンク文字の下線消す */
padding:2px 0 0 0;
}
#calendar table th{/*曜日*/
color: #666666;/*文字色*/
border-bottom: 1px #000000 solid;/*背景の色に合わせる*/
padding:3px 0 2px 0;
}
#calendar table td{/*日にち*/
border: 1px #999999 solid;/*線の太さ 色 線種*/
}
#calendar table td a{/*記事のある日*/
color: #999999;/*文字色*/
background-color: #666666; /* セルの背景色 */
text-decoration: none; /* リンク文字の下線消す */
display:block;
}
#calendar table td a:hover{/*マウスオーバー*/
color: #ffffff;/*文字色*/
background-color: #999999; /* セルの背景色 */
}


カレンダー11



/*■■ カレンダー11 ■■*/
#calendar table {/*全体*/
color: #ffffff;/*全体の文字色*/
border-bottom: 2px #999999 solid;/*線の太さ 色 線種*/
border-collapse: collapse;
}
#calendar table caption a,
#calendar table caption{/*月*/
color: #ffffff;/*文字色*/
}
#calendar table th{/*曜日*/
border-top: 2px #999999 solid;/*線の太さ 色 線種*/
border-bottom: 2px #999999 solid;/*線の太さ 色 線種*/
font-weight:normal;
padding:3px 0 2px;
}
#calendar table td{/*日にち*/

}
#calendar table td a{/*記事のある日*/
color: #999999;/*文字色*/
background-color: #333333; /* セルの背景色 */
text-decoration: none; /* リンク文字の下線消す */
display:block;
padding:3px 0px;
}
#calendar table td a:hover{/*マウスオーバー*/
color: #ffffff;/*文字色*/
background-color: #999999; /* セルの背景色 */
}
#calendar table th.sun {/*日曜*/
color: #ff1493;/*文字色*/
}
#calendar table th.sat {/*土曜*/
color: #0000ff;/*文字色*/
}

カレンダー12



/*■■ カレンダー12 ■■*/
#calendar table{/*全体*/
color:#999999;/*文字色*/
background-color:#262b38;/* セルの背景色 */
border-top:3px #666666 solid;/*線の太さ 色 線種*/
border-left:3px #666666 solid;/*線の太さ 色 線種*/
border-right:3px #333333 solid;/*線の太さ 色 線種*/
border-bottom: 3px #333333 solid;/*線の太さ 色 線種*/
}
#calendar table caption a{/* << と >> */
color:#262b38;/*文字色*/
text-decoration:none;
}
#calendar table caption{/*月*/
color:#262b38;/*文字色*/
background-color:#ffffff;/* セルの背景色 */
border-top:3px #666666 solid;/*線の太さ 色 線種*/
border-left:3px #666666 solid;/*線の太さ 色 線種*/
border-right:3px #333333 solid;/*線の太さ 色 線種*/
}
#calendar table th{/*曜日*/
color: #ffffff;/*文字色*/
}
#calendar table td a {
color:#ffffff;/*文字色*/
font-weight:bold;/*太文字*/
text-decoration:underline;
display:block;
}
#calendar table td a:hover {/*マウスオーバー*/
color:#999999;/*文字色*/
background-color:#ffffff;/* セルの背景色 */
text-decoration:none;
}


カレンダー13



/*■■ カレンダー13 ■■*/
#calendar table{/*全体*/
color:#999999;/*文字色*/
background-color:#262b38;/* セルの背景色 */
border-left:3px #666666 solid;/*線の太さ 色 線種*/
border-right:3px #333333 solid;/*線の太さ 色 線種*/
border-bottom: 3px #333333 solid;/*線の太さ 色 線種*/
}
#calendar table caption a{/* << と >> */
color:#ffffff;/*文字色*/
text-decoration:none;
}
#calendar table caption{/*月*/
color:#ffffff;/*文字色*/
background-color:#262b38;/* セルの背景色 */
border-top:3px #666666 solid;/*線の太さ 色 線種*/
border-left:3px #666666 solid;/*線の太さ 色 線種*/
border-right:3px #333333 solid;/*線の太さ 色 線種*/
}
#calendar table th{/*曜日*/
color: #262b38;/*文字色*/
background-color:#ffffff;/* セルの背景色 */
padding:2px 0 0 2px;
}
#calendar table td a {
color:#ffffff;/*文字色*/
font-weight:bold;/*太文字*/
text-decoration:underline;
display:block;
}
#calendar table td a:hover {/*マウスオーバー*/
color:#999999;/*文字色*/
background-color:#ffffff;/* セルの背景色 */
text-decoration:none;
}


カレンダー14



/*■■ カレンダー14 ■■*/
#calendar table{
color:#ffffff;/*文字色*/
background-color:#262b38;/* セルの背景色 */
border-left:3px #666666 solid;/*線の太さ 色 線種*/
border-right:3px #333333 solid;/*線の太さ 色 線種*/
border-bottom: 3px #333333 solid;/*線の太さ 色 線種*/
}
#calendar table caption a{/* << と >> */
color:#ffffff;/*文字色*/
text-decoration:none;
}
#calendar table caption{/*月*/
color:#ffffff;/*文字色*/
background-color:#262b38;/* セルの背景色 */
border-top:3px #666666 solid;/*線の太さ 色 線種*/
border-left:3px #666666 solid;/*線の太さ 色 線種*/
border-right:3px #333333 solid;/*線の太さ 色 線種*/
}
#calendar table th{/*曜日*/
color: #ffffff;/*文字色*/
background-color:#262b38;/* セルの背景色 */
padding:2px 0 0 2px;
}
#calendar table td a {
color:#ffffff;/*文字色*/
border:1px #ffffff solid;/*線の太さ 色 線種*/
text-decoration:none;
display:block;
}
#calendar table td a:hover {/*マウスオーバー*/
color:#262b38;/*文字色*/
background-color:#ffffff;/* セルの背景色 */
}


カレンダー15



/*■■ カレンダー15 ■■*/
#calendar table{
color:#ff6600;/*文字色*/
background-color:#262b38;/* セルの背景色 */
border-left:3px #666666 solid;/*線の太さ 色 線種*/
border-right:3px #333333 solid;/*線の太さ 色 線種*/
border-bottom: 3px #333333 solid;/*線の太さ 色 線種*/
}
#calendar table caption a{/* << と >> */
color:#ff6600;/*文字色*/
text-decoration:none;
}
#calendar table caption{/*月*/
color:#ffffff;/*文字色*/
background-color:#262b38;/* セルの背景色 */
border-top:3px #666666 solid;/*線の太さ 色 線種*/
border-left:3px #666666 solid;/*線の太さ 色 線種*/
border-right:3px #333333 solid;/*線の太さ 色 線種*/
}
#calendar table th{/*曜日*/
color: #ff6600;/*文字色*/
background-color:#262b38;/* セルの背景色 */
padding:2px 0 0 2px;
}
#calendar table td {/*日にち*/
font-style: italic;/*斜体*/
}
#calendar table td a {/*記事のある日*/
color:#ff6600;/*文字色*/
font-weight:bold;/*太文字*/
text-decoration:underline;
}
#calendar table td a:hover {/*マウスオーバー*/
color:#ffffff;/*文字色*/
background-color:#ff6600;/* セルの背景色 */
text-decoration:none;
display:block;
}



CSS カレンダーに画像をつけてカレンダーらしく?

CSS カレンダーをかわいく

CSS カレンダーをかわいく 2

CSS カレンダーをかわいく 3

CSS カレンダーをかわいく 4

CSS カレンダーをかわいく 5

CSS カレンダーをかわいく 6

CSS カレンダーをかわいく 7

CSS カレンダーをかわいく 8

CSS カレンダーをかわいく 緑組応援団

CSS カレンダーをかわいく 4

サンプルの下にCSSをつけました

好きなカレンダー下にあるCSSを自分のCSSの最後にコピペするだけで

サンプルと同じになるはずです

マウスを当てたときの変化も確認できます・・・・


カレンダー№ が同じ物は違いは色だけです

慣れてきたら好きな色に変更下さい


設置できましたらコメントをいただけると助かります

皆様の実際どうなるのか参考になりますし

どのタイプが人気があるのか知りたいんで・・・・ m(_ _)m



カレンダー07



/*■■ カレンダー07 ■■*/
#calendar table {/*全体*/
color:#999999;/*文字色*/
border-collapse: collapse;
}
#calendar table caption a{/* <<と>> */
color:#999999;/*文字色*/
}
#calendar table th,
#calendar table td{/*曜日・日にち*/
border-top: 1px #666666 solid;/*線の太さ 色 線種*/
border-bottom: 1px #666666 solid;/*線の太さ 色 線種*/
padding:2px 0;
}
#calendar table td a{/*記事のある日*/
color:#666666;/*文字色*/
background-color:#e0e0e0; /* セルの背景色 */
text-decoration: none; /* リンク文字の下線消す */
display:block;
}
#calendar table td a:hover{/*マウスオーバー*/
color: #ffffff;/*文字色*/
background-color: #666666; /* セルの背景色 */
}
#calendar table .sun {/*日曜*/
color:#ff0000;/*文字色*/
}
#calendar table .sat{/*土曜*/
color:#0000ff;/*文字色*/
}


カレンダー08



/*■■ カレンダー08 ■■*/
#calendar table {/*全体*/
color: #666666;/*全体の文字色*/
border-collapse: collapse;
}
#calendar table caption a{/* <<と>> */
color: #666666;
}
#calendar table th,
#calendar table td{/*曜日・日にち*/
border-top: 1px #666666 solid;/*線の太さ 色 線種*/
border-bottom: 1px #666666 solid;/*線の太さ 色 線種*/
padding:2px 0;
}
#calendar table td a{/*記事のある日*/
color:#666666;/*文字色*/
background-color:#e0e0e0; /* セルの背景色 */
border-right: 1px #ffffff solid;/*線の太さ 色(※背景と同じ色) 線種*/
text-decoration: none; /* リンク文字の下線消す */
display:block;
}
#calendar table td a:hover{/*マウスオーバー*/
color: #ffffff;/*文字色*/
background-color: #666666; /* セルの背景色 */
}


カレンダー09


/*■■ カレンダー09 ■■*/
#calendar table {/*全体*/
color: #666666;/*全体の文字色*/
border-collapse: collapse;
}
#calendar table caption{/*月*/
color: #666666;/*文字色*/
font-weight:bold;/*太文字*/
font-size:1.2em;/*文字サイズ*/
}
#calendar table caption a{/* <<と>> *//* <<と>> */
color: #666666;/*文字色*/
font-size:1em;/*文字サイズ*/
}
#calendar table caption{/*月*/
color: #666666;/*文字色*/
}
#calendar table th,
#calendar table td{/*日にち*/
border-bottom: 3px #666666 dotted;/*線の太さ 色 線種*/
}

#calendar table td a{/*記事のある日*/
color:#666666;/*文字色*/
background-color:#e0e0e0; /* セルの背景色 */
text-decoration: none; /* リンク文字の下線消す */
display:block;
}
#calendar table td a:hover{/*マウスオーバー時*/
color: #ffffff;/*文字色*/
background-color: #666666; /* セルの背景色 */
}
#calendar table th.sun {/*日曜*/
color: #ff1493;/*文字色*/
}
#calendar table th.sat {/*土曜*/
color: #00ced1;/*文字色*/
}

カレンダー07



/*■■ カレンダー07 ■■*/
#calendar table {/*全体*/
color: #ff00ff;/*文字色*/
border-collapse: collapse;
}
#calendar table caption a{/* <<と>> */
color: #ff00ff;
}
#calendar table th,
#calendar table td{/*曜日・日にち*/
border-top: 1px #ff33ff solid;/*線の太さ 色 線種*/
border-bottom: 1px #ff33ff solid;/*線の太さ 色 線種*/
padding:2px 0;
}
#calendar table td a{/*記事のある日*/
color:#ff00ff;/*文字色*/
background-color: #ffccff; /* セルの背景色 */
text-decoration: none; /* リンク文字の下線消す */
display:block;
}
#calendar table td a:hover{/*マウスオーバー*/
color:#ffffff;/*文字色*/
background-color: #ff00ff; /* セルの背景色 */
}
#calendar table .sun {/*日曜*/
color:#ff0000;/*文字色*/
}
#calendar table .sat{/*土曜*/
color:#0000ff;/*文字色*/
}



カレンダー08



/*■■ カレンダー08 ■■*/
#calendar table {/*全体*/
color: #ff00ff;/*全体の文字色*/
border-collapse: collapse;
}
#calendar table caption a{/* <<と>> */
color: #ff00ff;
}
#calendar table th,
#calendar table td{/*曜日・日にち*/
border-top: 1px #ff00ff solid;/*線の太さ 色 線種*/
border-bottom: 1px #ff00ff solid;/*線の太さ 色 線種*/
padding:2px 0;
}
#calendar table td a{/*記事のある日*/
color:#ffffff;/*文字色*/
background-color: #ff00ff; /* セルの背景色 */
border-right: 1px #ffffff solid;/*線の太さ 色(※背景と同じ色) 線種*/
text-decoration: none; /* リンク文字の下線消す */
display:block;
}
#calendar table td a:hover{/*マウスオーバー*/
color:#ff00ff;/*文字色*/
background-color: #ffccff; /* セルの背景色 */
}


カレンダー09



/*■■ カレンダー09 ■■*/
#calendar table {/*全体*/
color: #ff6347;/*全体の文字色*/
border-collapse: collapse;
}
#calendar table caption{/*月*/
color: #ff6347;/*文字色*/
font-weight:bold;/*太文字*/
font-size:1.2em;/*文字サイズ*/
}
#calendar table caption a{/* <<と>> *//* <<と>> */
color: #ff6347;/*文字色*/
font-size:1em;/*文字サイズ*/
}
#calendar table caption{/*月*/
color: #ff6347;/*文字色*/
}
#calendar table th,
#calendar table td{/*日にち*/
border-bottom: 3px #ff69b4 dotted;/*線の太さ 色 線種*/
}
#calendar table td a{/*記事のある日*/
display:block;
text-decoration: none; /* リンク文字の下線消す */
background-color: #ffc0cb; /* セルの背景色 */
color:#ff0000;/*文字色*/
}
#calendar table td a:hover{/*マウスオーバー時*/
background-color: #ff0000; /* セルの背景色 */
color: #ffffff;/*文字色*/
}
#calendar table th.sun {/*日曜*/
color: #ff1493;/*文字色*/
}
#calendar table th.sat {/*土曜*/
color: #00ced1;/*文字色*/
}



カレンダー07


/*■■ カレンダー07 ■■*/
#calendar table {/*全体*/
color: #ffffcc;/*文字色*/
border-collapse: collapse;
}
#calendar table caption a{/* <<と>> */
color: #ffffcc;
}
#calendar table th,
#calendar table td{/*曜日・日にち*/
border-top: 1px #ff33ff solid;/*線の太さ 色 線種*/
border-bottom: 1px #ff33ff solid;/*線の太さ 色 線種*/
padding:2px 0;
}
#calendar table td a{/*記事のある日*/
color:#ff00ff;/*文字色*/
background-color: #ffccff; /* セルの背景色 */
text-decoration: none; /* リンク文字の下線消す */
display:block;
}
#calendar table td a:hover{/*マウスオーバー*/
color:#ffffff;/*文字色*/
background-color: #ff00ff; /* セルの背景色 */
}
#calendar table .sun {/*日曜*/
color:#ff0000;/*文字色*/
}
#calendar table .sat{/*土曜*/
color:#0000ff;/*文字色*/
}


カレンダー08


/*■■ カレンダー08 ■■*/
#calendar table {/*全体*/
color: #ff00ff;/*全体の文字色*/
border-collapse: collapse;
}
#calendar table caption a{/* <<と>> */
color: #ff00ff;
}
#calendar table th,
#calendar table td{/*曜日・日にち*/
border-top: 1px #ff00ff solid;/*線の太さ 色 線種*/
border-bottom: 1px #ff00ff solid;/*線の太さ 色 線種*/
padding:2px 0;
}
#calendar table td a{/*記事のある日*/
color:#ffffff;/*文字色*/
background-color: #ff00ff; /* セルの背景色 */
border-right: 1px #ff99ff solid;/*線の太さ 色(※背景と同じ色) 線種*/
text-decoration: none; /* リンク文字の下線消す */
display:block;
}
#calendar table td a:hover{/*マウスオーバー*/
color:#ff00ff;/*文字色*/
background-color: #ffccff; /* セルの背景色 */
}


カレンダー09


/*■■ カレンダー09 ■■*/
#calendar table {/*全体*/
color: #ff6347;/*全体の文字色*/
border-collapse: collapse;
}
#calendar table caption{/*月*/
color: #ff6347;/*文字色*/
font-weight:bold;/*太文字*/
font-size:1.2em;/*文字サイズ*/
}
#calendar table caption a{/* <<と>> *//* <<と>> */
color: #ff6347;/*文字色*/
font-size:0.8em;/*文字サイズ*/
}
#calendar table caption{/*月*/
color: #ff6347;/*文字色*/
}
#calendar table th,
#calendar table td{/*日にち*/
border-bottom: 3px #ff69b4 dotted;/*線の太さ 色 線種*/
}
#calendar table td a{/*記事のある日*/
display:block;
text-decoration: none; /* リンク文字の下線消す */
background-color: #ffc0cb; /* セルの背景色 */
color:#ff0000;/*文字色*/
}
#calendar table td a:hover{/*マウスオーバー時*/
background-color: #ff0000; /* セルの背景色 */
color: #ffffff;/*文字色*/
}
#calendar table th.sun {/*日曜*/
color: #ff1493;/*文字色*/
}
#calendar table th.sat {/*土曜*/
color: #00ced1;/*文字色*/
}



カレンダー07


/*■■ カレンダー07 ■■*/
#calendar table {/*全体*/
color: #666666;/*文字色*/
border-collapse: collapse;
}
#calendar table caption a,
#calendar table caption{/*月*/
color: #666666;/*文字色*/
}
#calendar table th,
#calendar table td{/*曜日・日にち*/
border-top: 1px #999999 solid;/*線の太さ 色 線種*/
border-bottom: 1px #999999 solid;/*線の太さ 色 線種*/
padding:2px 0;
}
#calendar table td a{/*記事のある日*/
color: #999999;/*文字色*/
background-color: #666666; /* セルの背景色 */
text-decoration: none; /* リンク文字の下線消す */
display:block;
}
#calendar table td a:hover{/*マウスオーバー*/
color: #ffffff;/*文字色*/
background-color: #999999; /* セルの背景色 */
}


カレンダー08


/*■■ カレンダー08 ■■*/
#calendar table {/*全体*/
color: #666666;/*文字色*/
border-collapse: collapse;
}
#calendar table caption a,
#calendar table caption{/*月*/
color: #666666;/*文字色*/
}
#calendar table th,
#calendar table td{/*曜日・日にち*/
border-top: 1px #999999 solid;/*線の太さ 色 線種*/
border-bottom: 1px #999999 solid;/*線の太さ 色 線種*/
padding:2px 0;
}
#calendar table td a{/*記事のある日*/
color: #0033cc;/*文字色*/
background-color: #666666; /* セルの背景色 */
border-right: 1px #000000 solid;/*線の太さ 色 線種*/
text-decoration: none; /* リンク文字の下線消す */
display:block;
}
#calendar table td a:hover{/*マウスオーバー*/
color: #ffffff;/*文字色*/
background-color: #999999; /* セルの背景色 */
}


カレンダー09


/*■■ カレンダー09 ■■*/
#calendar table {/*全体*/
color: #ffffff;/*全体の文字色*/
border-collapse: collapse;
}
#calendar table caption{/*月*/
color: #ffffff;/*文字色*/
font-weight:bold;/*太文字*/
font-size:1.2em;/*文字サイズ*/
}
#calendar table caption a{/*<< と >>*/
color: #ffffff;/*文字色*/
font-size:0.8em;/*文字サイズ*/
}
#calendar table th,
#calendar table td{/*日にち*/
border-bottom: 3px #ffffff dotted;/*線の太さ 色 線種*/
font-weight:normal;
}
#calendar table td a{/*記事のある日*/
color:#333333;/*文字色*/
background-color: #666666; /* セルの背景色 */
text-decoration: none; /* リンク文字の下線消す */
display:block;
}
#calendar table td a:hover{/*マウスオーバー時*/
color: #ffffff;/*文字色*/
background-color: #999999; /* セルの背景色 */
}
#calendar table th.sun {/*日曜*/
color: #ff1493;/*文字色*/
}
#calendar table th.sat {/*土曜*/
color: #00ced1;/*文字色*/
}




CSS カレンダーに画像をつけてカレンダーらしく?

CSS カレンダーをかわいく

CSS カレンダーをかわいく 2

CSS カレンダーをかわいく 3

CSS カレンダーをかわいく 4

CSS カレンダーをかわいく 5

CSS カレンダーをかわいく 6

CSS カレンダーをかわいく 7

CSS カレンダーをかわいく 8

CSS カレンダーをかわいく 緑組応援団