CSS Generator

Seesaaブログ用のスタイルシートを作成します。
項目にそって入力して下さい。全ての項目を埋める必要はありません。必要な箇所だけ(コンテンツだけ等)の入力、出力も可能です。入力後はページ下の[スタイルシート作成]ボタンをクリックして下さい。

1. ページの設定

ページの幅タイプを指定して下さい。

全幅表示
幅指定  width 左align センタリング

左右メニューの使用を指定して下さい。

左メニュー使用する
右メニュー使用する 左右メニュー同じ設定を用いる

ページ全体の共通設定を指定して下さい。

文字色
背景色
パッディング
マージン
背景画像 http://

2. ページ全体のデザイン

ページ全体のデザインを指定して下さい。(参考:ページ全体のデザイン

<div id=banner>
 高 背景色 パッディング マージン
背景画像 http://
ボーダー ボーダー色 ボーダー幅
<div id=left>
背景色
パッディング
マージン
ボーダー
ボーダー色
ボーダー幅
<div id=content>
背景色
パッディング
マージン
ボーダー
ボーダー色
ボーダー幅
<div id=right>
背景色
パッディング
マージン
ボーダー
ボーダー色
ボーダー幅
<div id=bottom>
 高 背景色 パッディング マージン
背景画像 http://
ボーダー ボーダー色 ボーダー幅

3. サイトヘッダーのデザイン

サイトヘッダーのデザインを指定して下さい。(参考:サイトヘッダーのデザイン
サイトタイトル <h1>
フォント種類
文字サイズ
文字色
マージン
サイト説明 <class=description>
フォント種類
文字サイズ
文字色
マージン

4. 記事のデザイン

記事のデザインを指定して下さい。(参考:記事のデザイン

class=blog
パッディング
マージン
class=blogbody
パッディング
マージン

日付 (class=date)
文字サイズ
文字色
文字太さ太文字
背景色
パッディング
ボーダー
 色
align
タイトル (class=title)
文字サイズ
文字色
文字太さ太文字
背景色
パッディング
ボーダー
 色
align

本文 (class=text)
文字サイズ
文字色
背景色
パッディング
ボーダー 色 幅

投稿者、日付欄 (class=posted)
文字サイズ
文字色
背景色
パッディング
ボーダー 色 幅
align

5. カレンダーのデザイン

カレンダーのデザインを指定して下さい。(参考:カレンダーのデザイン

<id=calendar>
パッディング
マージン

年月 <class=calendarhead>
文字サイズ
文字色
文字太さ太文字
背景色
パッディング
ボーダー 色 幅

曜日 <id=calendar>+<th>
文字サイズ
文字色
文字太さ太文字
パッディング
背景色
日 <id=calendar>+<td>
文字サイズ
文字色
パッディング
背景色

6. サイドバーに表示するコンテンツのデザイン

新着記事、カテゴリ、過去ログ、記事検索、最近のコメント、最近のトラックバックなどのサイドバーに表示するコンテンツのデザインを指定して下さい。(参考:サイドバーに表示するコンテンツのデザイン

サイドタイトル (class=sidetitle)
文字サイズ
文字色
文字太さ太文字
背景色
パッディング
ボーダー 色 幅

サイド本文 (class=side)
文字サイズ
背景色
パッディング

7. スタイルシートの作成

サイトマップ

Seesaaブログのカスタマイズ > スタイルシート カスタマイズ > テンプレートの変更方法
スタイルシート カスタマイズ

スタイルシート作成ツール

HTMLカスタマイズ
サイト全体

記事コンテンツ

コメント、トラックバック
新着記事

カテゴリ

最近のコメント、トラックバック

検索ページ

その他