メイン

■DIARY　CSS テンプレート001 ふつうタイプ　ただし使わなくていいところまで画像を貼れるようにしてます
資料です

windows版 IE6 firefox opera 以外のブラウザには対応してません IE7は持ってないのでわかりませんfirefoxのアドオンの描画でみる程度なのでまともに対応できませんのでよろしく

@import url("common.css");

/* 全称セレクタ */
* {
 margin: 0;
 padding: 0;
 box-sizing: border-box;
 -moz-box-sizing: border-box; 
}

body {
background-color: #ffffff;
background-image: url(http://www.eclat.cc/theme/sanpo/sq-blue.gif) ;
background-attachment: fixed;
font-family:"MS UI Gothic","ＭＳ Ｐゴシック";
font-size:10pt;
}

a:link {text-decoration:none; color:#ff00ff; }
a:visited {text-decoration:none; color:#ff00ff; }
a:hover {text-decoration:none; color:#9900ff; }

/* ヘッダー部分 */

#header{
padding: 0.5em 1em 110px 1em;
margin-bottom:0.5em;
width:;
border-width :;
border-style :;
border-color :;
background:url() no-repeat 98% 50%;
background-color:;
}

/* ヘッダー　日記のタイトル */
#site_title {
font-size:200%;
font-weight: bold;
position:absolute; top:15px; right:30px;
color:#00bfff;
}

/* ヘッダー　日記の概説 */
#site_info{
margin-bottom:10px;
font-size:100%;
font-weight: bold;
color:#ff6600;
}

/* 戻るリンク */
#back_link li{
display:;
padding-left:0.5em;
}

#back_link a{
font-size:100%;
font-weight: bold;
color:#0000ff;
}

#back_link a:hover{
font-size:100%;
font-weight: bold;
color: #ff00ff;
}

/* メイン */
#main {
margin-right:25%;
}

/* 日記本体 */
.entry {
padding: 0.5em;
margin-left:5px;
margin-bottom:20px;
background-color:#ffffff;
letter-spacing : 1px;
line-height : 1.5em;
border-width : 1px;
border-style : solid;
border-color : blue;
background:url(http://www.eclat.cc/theme/sanpo/p-b.gif);
}

/* 記事日付 */
.entry_date{
background-image:url(http://www.eclat.cc/theme/mad/walla7.gif);
background-color:;
color:#000000;
font-weight: bold;
border-right:1px solid #666666; 
border-bottom:1px solid #333333;
padding:;
width:;
text-align:center;
}

/* 記事タイトル */
.entry_title{
font-weight:bold;
font-size:115%;
letter-spacing:0.1em;
background-color:#fff0f5; 
padding:5px;
border-width: 1px;
border-style: solid;
border-color: #0000ff;
margin: 5px;
background-image: url();
background-repeat: no-repeat;
background-position: 98% 95%;
}

/* 記事カテゴリー */
.entry_info{
font-size:80%;
padding-left: 0.5em;
}

/* 記事カテゴリー アイコン設定*/
.entry_info a{
background: url() no-repeat left center;
padding-left:16px;
}

/* 記事カテゴリー アイコン設定　マウスON時*/
.entry_info a:hover {
background: url() no-repeat left center;
background-color:#ffff00;
}

/* 記事 */
.entry_body{
font-size:107%;
line-height:140%;
color:navy;
background-color:#ccffff; 
background-image: url();
background-repeat: no-repeat;
background-position: 98% 98%;
padding:10px;
border-width: 2px;
border-style: dotted;
border-color: #0000ff;
margin: 5px;
overflow:auto;
}

/* IE6で連続する半角英数字が改行されない修正 */
.entry_body{word-break:break-all; white-space: ; }

/* 本体にある記事コメントリンク */
.entry_responses{
font-size:90%;
padding-right:1em;
text-align:right;
}

/* 本体にある記事コメントリンクアイコン設定*/
.entry_responses a{
background: url() no-repeat left center;
padding-left:16px;
}

/* 本体にある記事コメントリンクアイコン設定　マウスON時*/
.entry_responses a:hover {
background: url() no-repeat left center;
background-color:#FFFF00;
}

/* 年別ページ */
#archive_yearlist{
background-image: url(http://www.eclat.cc/theme/sanpo/p-b.gif);
margin:20px;
}

#archive_yearlist h2{
padding-left:20px;
border-width: 1px;
border-style: solid;
border-color: #0000ff;
margin: 5px;
width:10em;
color:#000080;
}

#archive_yearlist dt{
padding-left:30px;
color:#0000ff;
font-size:14pt;
}

#archive_yearlist ul{
padding-left:40px;
color:#ff00ff;
font-size:11pt;
}

#archive_yearlist li{
color:#ff00ff;
border-width: 1px;
border-style: solid;
border-color: #00ffff;
margin-bottom: 4px;
margin-right: 30px;
display:block;
background-color:#ffffff;
padding:4px;
}

/* メニュー */
#menu {
width:25%;
float:right;
}

/* 最新の記事 最新のコメント archives categories 前後の記事*/
.link{
margin: 0 0.5em 1em 0.5em ;
font-size :;
color : #333333;
background-color : white;
letter-spacing : 1px;
line-height :;
border-width : 1px;
border-style : solid;
border-color : blue;
padding:0.5em 0.2em 0.2em 0.2em;
background:url(http://www.eclat.cc/theme/sanpo/b-o.gif);
}

/* (右側メニュー部)各タイトル */
.link_title{
font-size:95%;
font-weight: bold;
text-align:center;
background-color :#ccffff;
border-right:1px solid #666666; 
border-bottom:1px solid #333333;
margin:0.1em 1em 0.1em 1em;
line-height : 1.5em;
background-image: url(http://www.eclat.cc/theme/mad/walla4.gif);
}

/* (右側メニュー部)各リンク */
ul{
font-size:90%;
padding:;
margin-left:5px;
list-style-type:none;
width:;
}

#latest_articles ul a ,#latest_comments ul a ,#neighbors ul a{
display:block;
width:;
}

li {
padding:0.1em 0em 0.1em 0em;
}

li a{
background: url() no-repeat left center;
padding: 4px 2px 4px 20px;

}

li a:hover {
background: url() no-repeat left center;
background-color:#ffff00;
}

/* 罫線 */
hr {
 display: none;
}

/* 改行対策 */
br { letter-spacing: 0; }

/* コメントフォーム部 */
.comment_form {
margin-bottom:1em;
background-image: url(http://www.eclat.cc/theme/sanpo/sq-pink.gif); 
padding:1em;
}

/* フォーム部(名前)の色とサイズ */
#poster_name{
display: block;
color:#0000ff;
font-size:12pt;
}

/* 名前フォーム部のデザイン */
#poster_name input{
border-style:solid; 
border-width:1px; 
border-color:#0000ff; 
color:#ff00ff; 
background:#ccffff;
width:10em;
font-size:11pt;
}

/* フォーム部(コメント)の色とサイズ */
#comment_field{
display: inline;
color:#008000;
font-size:12pt;
}

/* コメントフォーム部のデザイン */
#comment_field input {
width:28em;
border-style:solid;
border-width:1px;
border-color: #9900ff;
background:#ffccff;
color:#0000ff;
font-size:11pt;
}

/* 投稿ボタンのデザイン */
input {
border-style:double;
 border-width:3px;
 border-color: #0000ff;
 background:#ffffff;
color:#0000ff;
}

/* コメント部全体の壁紙設定 */
.comment{
background-image: url(http://www.eclat.cc/theme/sanpo/m-b.gif);
padding:2px;
border-width: 1px;
border-style: solid;
border-color: #0000ff;
margin:0px 0px 10px 5px;
width:;
}

/* 各コメント部 */
.comment_element {
padding: 0.5em 0.5em 0.5em 0.5em;
margin-bottom:1em;
background-color:#ffffff;
border-width: 1px;
border-style: dotted;
border-color: #0000ff;
}

/* 各コメント投稿者 */
.comment_auther{font-size:10pt;}

/* コメント文字部 */
.comment_body {color:chocolate;}

/* これ以前の記事リンク */
.link_older {
font-size:12pt;
background-color:;
font-weight: 600;
padding:1em;
}

/* これ以前の記事リンク アイコン設定*/
.link_older a{
background: url() no-repeat left center;
padding-left:16px;
}

/* これ以前の記事リンク アイコン設定　マウスON時*/
.link_older a:hover {
background: url() no-repeat left center;
background-color:#ffff00;
}

/*ページめくり */
.page_link{
font-size:12pt;
margin-left10px;
color:#800000;
font-weight: bold;
}