[Seesaa デザインテンプレート]

<<2004年10月| Main |2004年12月>>

2004年11月18日

テンプレートヌリドウォール

HOME ⇒ シンプル ⇒ この記事

使用するテーマ：路地(右サイドバーのみ対応)
レイアウト：右サイドバー

@charset "shift_jis"; 
/*

このCSSは、Seesaaブログ用です。 
文字色、大枠レイアウトマージン、各パーツマージンと分けて記述しています。
修正等は自由ですが、CSSに関する質問は受け付けていませんので自己責任でお願いします。

<a href="http://template.seesaa.net" target="_blank">http://template.seesaa.net</a>

/* font-size, color, line-height */

h1 {
	font-size: 1.2em;
	}
	h1 a{
	color: #CC3300;
	}
	h2,h3{
	font-size: 1em;
	}
	
	#banner, #content, #links{
		font-size: 0.95em;
		color: #333333;
		line-height: 140%;
	}

a{
		text-decoration: none;
		color: #0066CC;
		padding: 0px 0.2em 0px 0em;
	}

a:hover{
		color: #3333FF;
		text-decoration: underline;
	}
	
	#calendar table td,#calendar table th, .calendarhead {
	font-size: 12px;
	line-height: 100%;
	background: #F4F2EC;
	}
	.description {
	}
/* layout color */

body {
	background: #CCCCCC url(image/back.jpg) repeat-y left top;
}
#container{
	background: #FFFFFF url(image/back.gif);
}
#banner {
	border-bottom: 2px solid #D3CFC9;
	background: url(image/head.gif);
}
#content {
}
#footer{
	border-top: 2px solid #999999;
}
.calendarhead {
	background: #EC862B;
	color: #FFFFFF;
	border-bottom: 5px solid #333333;
}
.sidetitle {
	color: #302C1F;
	font-weight: bold;
	border-bottom: 7px solid #64645A;
}
.side {
	background: #F2F4F0;
}
.posted, .comments-post{
	border-top: 1px dashed #CCCCCC;
	border-bottom: 1px dashed #CCCCCC;
	background: #F8F8F3;
}
#calendar {
	border: 1px solid #999999;
}
/* layout margin */

* {
	margin: 0px;
}
.text, .navi, blockquote, .posted{
	margin: 1em 20px 2em;
}
.title {
	margin: 0px 10px;
}
#comments, #trackback {
	margin: 0px 35px 2em;
}

/* base layout */
body {
}
#container{
	text-align: left;
	width: 710px;
	margin: 0px 0px 0px 75px;
	padding: 0px;
}
#banner {
	margin: 0px 0px 20px;
	padding: 30px 0px 20px 20px;
}
#content {
	float: left;
	margin: 0px;
	padding: 0px;
	width: 500px;
}
#links {
	margin: 0px 5px 0px 0px;
	width: 190px;
	padding: 0px;
	float: right;
}
#footer{
	padding: 5px;
	clear: both;
	margin: 0px;
}
/* parts */
.navi {
	border-bottom: 1px solid #CCCCCC;
	padding: 3px 3px 5px;
}

.blog {}
.blogbody {}
.date{
	margin: 1em 20px 0px;
	text-align: right;
	padding: 0px 0px 18px;
	background: url(image/dateback01a.gif) no-repeat right bottom;
}

.title a{}
blockquote {
	border: 1px solid #CCCCCC;
	padding: 10px;
}
.posted{
	padding: 5px;
}
.posted a{
}
#calendar {
	margin: 0px 0px 1em;
}
#calendar table {
	width: 188px;
}
.calendarhead {
	padding: 5px 0px 3px;
}
.calendarday {
	padding: 4px 0px;
}
.calendarday a{
	font-weight: bold;
}
.sidetitle {
	padding: 5px 0px 2px 3px;
	margin: 0px 0px 2px;
}
.side {
	padding: 10px;
	margin: 0px 0px 1em;
}
.powered {
}
.syndicate {
}
.syndicate a{
}
#comments {
}
#comments textarea{

}
.comments-head{
	font-weight: bold;
	margin: 0px 0px 1em;
}

.comments-body {
}

.comments-post{ 
	padding: 5px;
}
.comments-post a{
}
textarea {
	width: 350px;
}
input {
	width: 150px;
	line-height: 1.2em;
}
#trackback {
}
#trackback a {
}
.trackback-url {
}
.trackback-body {
}
.trackback-post {
}
.trackback-post a {
}
.copyright{
}
#diet-container{
}
.diet-title{
}
.diet-content{
}
#diet-foods{
}
.food-title{
}
.food-content{
}

次のZIPファイルをダウンロードし解凍します。解凍するとテンプレートで使用する画像が入っていますので、ファイルマネージャーからimageフォルダへアップしてください。注：ファイル名は変更しませんように

image_nuri.zip

解凍ツールはLhasaが便利です。

posted by えびす at 21:57 | Comment(0) | TrackBack(1) | シンプル

2004年11月03日

コメント欄の不具合修正

HOME ⇒ 日記 ⇒ この記事

各テンプレートでコメントを入力する際に、コメント欄が横長に伸びてしまう不具合を修正しました。

続きを読む

posted by えびす at 18:50 | Comment(0) | TrackBack(0) | 日記

2004年11月01日

カラーコードパレット

HOME ⇒ Blogの小技 ⇒ この記事

エディタでソースを編集しながらブラウザで確認して作る場合、背景色や文字色の指定は面倒です。そんな時に使う簡易のカラーコードを取得できるツールがこれ。

カラーコードパレット

専用ツールとまではいかなくても、ちょこっと色の確認が出来ると意外と便利。

ダウンロードして使うタイプのツールを探す場合は、ベクターで探すとこと。
ベクター「カラーコード」で検索。

配色を考えるのは楽しいのだけれど、綺麗な配色って難しいのですよね＾＾：

posted by えびす at 15:35 | Comment(3) | TrackBack(0) | Blogの小技