無料ブログのスタイルシートでデザイン変更：A-aucホームページ

　　スタイルシートを変更・・・無料ブログで自分流に

　　A-aucの無料ブログは・・・

　●　申し込み後、すぐにご利用可能です！
　●　テンプレートを、９種類の中からいつでも変更出来ます。
　●　テンプレート以外でも、CSSの変更でデザインに変更可能です。
　●　カテゴリーを増やして、お好きなジャンルを更新出来ます。
　●　携帯電話での観覧や記事投稿や画像アップロードも出来ます。
　　
　■ ブログ：トップページ
　■ ブログ：ユーザーパネルについて
　■ ブログ・ランキング新規登録及び登録内容変更
　■ ブログ・サンプル
　■ カスタムスタイルシート変更サンプル
　■ すぐに使えるスタイルシート

　　　◆　A-auc 無料ブログカスタムスタイルシート　サンプル集

　　　　　　　■カスタムスタイルシート変更方法

　　　　　　　　　　１、ブログ管理画面のブログ設定より「カスタムＣＳＳを使用する」にチェックを入れてください。
　　　　　　　　　　２、「ＣＳＳの編集はこちら」をクリックすると、ＣＳＳの編集画面が表示されます。
　　　　　　　　　　３、記載しているＣＳＳを一度削除し、下記画像の横に記載されているＣＳＳを全て貼り付けてください。
　　　　　　　　　　４、必要に応じて、タイトルバナーのＵＲＬやカラーを書き換えて「内容を保存」をクリックします。
　　　　　　　　　　５、「ブログを見る」よりスタイルシートが変更されていることを確認して下さい。

　　　　　　　　　　※タイトル画像・背景画像などは、各自でご用意して頂いて変更をして頂く必要があります。
　　　　　　　　　　　ブログ内の、各枠線・文字などの色の変更部分は、CSSスタイルシート内にて記載説明が御座いますので
　　　　　　　　　　　各部分の色変更は簡単に行えます。

　　　 ◆　A-auc 無料ブログオリジナルスタイルシート大募集！

　　　　　　　　　　　オリジナルスタイルシートを公開したい方を募集しています。
　　　　　　　　　　　A-aucブログのカスタムスタイルシートを編集してオリジナルのスタイルシートを作成して下さい。
　　　　　　　　　　　作成したスタイルシートのコピーとブログURLをお送り下さい、お送り頂いたスタイルシートは
　　　　　　　　　　　サイト内にて掲載させて頂きます。

　　　　　　　　　　　A-aucブログオリジナルスタイルシートの応募はこちらから

サンプル１

テキストBOX内の、スタイルシートをすべて選択・コピーして下さい。
　　　

* {
	margin: 0;
	padding: 0;
}
body {
	font-size: 13px;
	font-family: "ＭＳ Ｐゴシック";
        background-image:url(http://○○○.net/○○○.jpg);　　/* 壁紙画像のURLを入力 */
	color: Maroon;
}
p {
	margin: 10px 0;
}
img {
	border: none;
}

/*====================================*/
/* 各コンテナ                         */
/*====================================*/

#wrapper {
	width: 740px;
	margin: 0 auto;
	border-left: 1px solid #ccc;
	border-right: 1px solid #ccc;
}

#header {
	padding: 20px;
	border-bottom: 1px solid #ccc;
        height: 130px;      /* タイトル画像の高さを入力 */
        width: 700px;　　　/* タイトル画像の幅を入力 */
        background-image:url(http://○○○.net/○○○.gif);　/* タイトル画像のURLを入力 */
}

#content {
	width: 710px;
	margin: 0 auto;
}

#main {
	width: 495px;
	float: left;
}

#side {
	width: 200px;
	float: right;
}

#bottom {
	margin: 5px 15px 0;
	padding: 10px 0 0;
	text-align: center;
	font : normal 11px Arial;
	color: #666;
	border-top: 1px solid #ECECEC;
}

/*====================================*/
/* サイド                             */
/*====================================*/

#side .head {
	margin-top: 10px;
}
#side .body {
	padding: 0px 15px 0;
}
#side .foot {
	height: 15px;
}

#side dl {
	padding-bottom: 20px;
}
#side dt {
	font-family: "Trebuchet MS";
	font-weight: bold;
}
#side dd ul {
	margin-left: 15px;
}
#side dd li {
	margin: 3px 0 0;
}

#side .ipt {
	width: 110px;
}

/*====================================*/
/* エントリー                         */
/*====================================*/

.entry {
	margin: 10px 0 0;
	padding: 0 0 20px;
}
.entry .head {
	padding: 5px;
    color: #000;
	font-size: medium;
	border-left: 5px solid #aaa;
}
.entry .body {
	padding: 15px 5px;
}
.entry .body img {
	display: block;
	float: left;
	margin: 0 10px 10px 0;
}
.entry .foot {
	clear: both;
	text-align: right;
	border-bottom: 1px solid #ccc;
}
.entry .foot li {
	display: inline;
	font-size: 11px;
	color: #999;　　　/* 投稿記事の日付文字の文字色 */
}

/*====================================*/
/* コメント                           */
/*====================================*/

.comment {
	padding-left: 10px;
}
.comment .tab {
	padding-left: 3px;
	font-family: "Trebuchet MS", Trebuchet;
	font-weight: bold;
	border-left: 3px solid #666;
	border-bottom: 1px solid #666;
}
.comment dt {
	margin-top: 10px;
	padding-bottom: 10px;
	line-height: 1.2;
}
.comment dd {
	border-bottom: 1px dotted #ccc;
}
.comment dd ul {
	list-style: none;
	text-align: right;
	font-size: 11px;
}
.comment dd li {
	display: inline;
}

/* コメントフォーム */
.comment .form {
	margin-top: 15px;
}
.comment .form .ipt {
	width: 200px;
	border: 1px solid #ccc;
	padding: 1px 0;
}
.comment .form textarea {
	margin: 0 0 10px;
	width: 300px;
	border: 1px solid #ccc;
}

/*====================================*/
/* トラックバック                     */
/*====================================*/

.trackback {
	margin-top: 15px;
	padding-left: 10px;
}
.trackback .tab {
	padding-left: 3px;
	font-family: "Trebuchet MS", Trebuchet;
	font-weight: bold;
	border-left: 3px solid #666;
	border-bottom: 1px solid #666;
}
.trackback dt {
	margin-top: 10px;
	padding-bottom: 10px;
	line-height: 1.2;
}
.trackback dd {
	line-height: 1.2;
	border-bottom: 1px dotted #ccc;
}
.trackback dd ul {
	list-style: none;
	text-align: right;
	font-size: 11px;
}
.trackback dd li {
	display: inline;
}

/* =================================== */
/* カレンダー                          */
/* =================================== */

.calendar {
	width: 170px;
	text-align: center;
}
.calendar .month {
	font-size: 12px;
	font-family: Verdana;
	color: #666;　　　/* カレンダーの年・月　表示色 */
}
.calendar .week {
	margin-top: 3px;
	font-size: 10px;
	font-family: Arial;
	color: #666;　　　/* カレンダーの曜日　表示色 */
}
.calendar .week div {
	width: 22px;
	float: left;
}
.calendar .day {
	margin-top: 2px;
	font-size: 10px;
	font-family: Verdana;
	color: #666;　　　/* カレンダーの日付　表示色 */
}
.calendar .day div {
	width: 20px;
	height: 18px;
	line-height: 18px;
	float: left;
	background: #FFCCCC;　　　/* カレンダーの背景色 */
	border: 1px solid #ffffff;　　　/* カレンダーの背景枠線色 */
}

/* =================================== */
/* その他                              */
/* =================================== */
.clear {
	clear: both;
	font-size: 0;
}

サンプル２

テキストBOX内の、スタイルシートをすべて選択・コピーして下さい。
　　　

* {
	margin: 0;
	padding: 0;
}
body {
	font-size: 13px;
	font-family: "ＭＳ Ｐゴシック";
	color: #333;
        background-color: #99CC66;　　　/* 背景色を入力 */
}
p {
	margin: 10px 0;
}
img {
	border: none;
}

/*====================================*/
/* 各コンテナ                         */
/*====================================*/

#wrapper {
	width: 740px;
	margin: 0 auto;
	border-left: 5px solid Orange;　　　/* 左の枠線の色を変える */ 
	border-right: 5px solid Orange;　　　/* 右の枠線の色を変える */ 
        background-color: #FFFFFF;　　　/* 中央部だけ背景色を変える */ 
}

#header {
	padding: 20px;
	border-bottom: 10px solid #FFCCCC;
        height: 160px;      /* タイトル画像の高さを入力 */ 　　　　　　
        width: 700px;　　　/* タイトル画像の幅を入力 */　　　　　　　
        background-image: url(http://○○○.net/○○○.jpg);  　/* タイトル画像のURLを入力 */
}
        background-repeat: no-repeat;

}

#content {
	width: 710px;
	margin: 0 auto;
}

#main {
	width: 495px;
	float: left;
}

#side {
	width: 200px;
	float: right;
}

#bottom {
	margin: 5px 15px 0;
	padding: 10px 0 0;
	text-align: center;
	font : normal 11px Arial;
	color: #666;
	border-top: 1px solid #ECECEC;
}

/*====================================*/
/* サイド                             */
/*====================================*/

#side .head {
	margin-top: 10px;
}
#side .body {
	padding: 0px 15px 0;
        background-color: LemonChiffon;　　　/* サイド部背景色変更 */ 
	border-left: 5px solid Gold;　　　　/* サイド部左の枠線の色を変える */ 
	border-right: 5px solid Gold;　　　　/* サイド部右の枠線の色を変える */ 
}
#side .foot {
	height: 15px;
}
#side dl {
	padding-bottom: 20px;
}
#side dt {
	font-family: "Trebuchet MS";
	font-weight: bold;
}
#side dd ul {
	margin-left: 15px;
}
#side dd li {
	margin: 3px 0 0;
}

#side .ipt {
	width: 110px;
}

/*====================================*/
/* エントリー                         */
/*====================================*/

.entry {
	margin: 10px 0 0;
	padding: 0 0 20px;
}
.entry .head {
	padding: 5px;
        color: #000;
	font-size: medium;
	border-left:20px solid Orange;　　　　/* 記事タイトルのリストマークの色・サイズ変更 */ 
        background-color: LemonChiffon;　　　/* 投稿タイトル背景色変更 */ 
}
.entry .body {
	padding: 15px 5px;
}
.entry .body img {
	display: block;
	float: left;
	margin: 0 10px 10px 0;
}
.entry .foot {
	clear: both;
	text-align: right;
	border-bottom: 5px solid #99CC66;　　　/* 投稿記事部の下線色変更 */ 
}
.entry .foot li {
	display: inline;
	font-size: 11px;
	color: #999;
}

/*====================================*/
/* コメント                           */
/*====================================*/

/*====================================*/
/* トラックバック                     */
/*====================================*/

/* =================================== */
/* カレンダー                          */
/* =================================== */

.calendar {
	width: 170px;
	text-align: center;
}
.calendar .month {
	font-size: 12px;
	font-family: Verdana;
	color: #99CC66;　　　/* カレンダーの年・月　表示色 */
}
.calendar .week {
	margin-top: 3px;
	font-size: 10px;
	font-family: Arial;
	color: #99CC66;　　　/* カレンダーの曜日　表示色 */
}
.calendar .week div {
	width: 22px;
	float: left;
}
.calendar .day {
	margin-top: 2px;
	font-size: 10px;
	font-family: Verdana;
	color: #FFFFFF;　　　/* カレンダーの日付　表示色 */
}
.calendar .day div {
	width: 20px;
	height: 18px;
	line-height: 18px;
	float: left;
	background: #99CC66;　　　/* カレンダーの背景色 */
	border: 1px solid Gold;　　　/* カレンダーの背景枠線色 */
}

/* =================================== */
/* その他                              */
/* =================================== */
.clear {
	clear: both;
	font-size: 0;
}

サンプル３

テキストBOX内の、スタイルシートをすべて選択・コピーして下さい。
　　　

* {
	margin: 0;
	padding: 0;
}
body {
	font-size: 13px;
	font-family: "ＭＳ Ｐゴシック";
	color: MediumVioletRed;　　　/* 文字色を入力 */
}
p {
	margin: 10px 0;
}
img {
	border: none;
}

/*====================================*/
/* 各コンテナ                         */
/*====================================*/

#wrapper {
	width: 740px;
	margin: 0 auto;
	border-left: 5px solid MediumPurple;　　　/* 左の枠線の色を変える */ 
	border-right: 5px solid MediumPurple;　　　/* 右の枠線の色を変える */
}

#header {
	padding: 20px;
	border-bottom: 1px solid #ccc;
        height: 70px;      /* タイトル画像の高さを入力 */ 　
         width: 700px;　　　/* タイトル画像の幅を入力 */　　　　
         background-image: url(http://○○○.net/○○○.gif);  　/* タイトル画像のURLを入力 */
        background-repeat: no-repeat;　　　/* 画像をリピートしない設定 */ 
}

#content {
	width: 710px;
	margin: 0 auto;
}

#main {
	width: 495px;
	float: left;
}

#side {
	width: 200px;
	float: right;
}

#bottom {
	margin: 5px 15px 0;
	padding: 10px 0 0;
	text-align: center;
	font : normal 11px Arial;
	color: #666;
	border-top: 1px solid #ECECEC;
}

/*====================================*/
/* サイド                             */
/*====================================*/

#side .head {
	margin-top: 10px;
        height: 180px;      /* サイド画像の高さを入力 */　
        width: 150px;      /* サイド画像の幅を入力 */　　　　
        background-image: url(http://○○○.net/○○○.jpg);  　/* サイド画像のURLを入力 */
        background-repeat: no-repeat;　　/* 画像をリピートしない設定 */ 
}
#side .body {
	padding: 0px 15px 0;
        background-color: #FFCCcc;　　　/* サイド部背景色変更 */ 
	border-left: 3px solid Violet;　　　　/* サイド部左の枠線の色を変える */
	border-right: 3px solid Violet;　　　　/* サイド部右の枠線の色を変える */
}
#side .foot {
	height: 15px;
}
#side dl {
	padding-bottom: 20px;
}
#side dt {
	font-family: "Trebuchet MS";
	font-weight: bold;
}
#side dd ul {
	margin-left: 15px;
}
#side dd li {
	margin: 3px 0 0;
}

#side .ipt {
	width: 110px;
}

/*====================================*/
/* エントリー                         */
/*====================================*/

.entry {
	margin: 10px 0 0;
	padding: 0 0 20px;
}
.entry .head {
	padding: 5px;
    color: #000;
	font-size: medium;
	border-left: 5px solid #aaa;
        background-image: url(http://○○○.net/○○○.gif);　　　/* 投稿タイトル背景画像変更 */ 
        background-repeat: no-repeat;　　/* 画像をリピートしない設定 */ 
}
.entry .body {
	padding: 15px 5px;
}
.entry .body img {
	display: block;
	float: left;
	margin: 0 10px 10px 0;
}
.entry .foot {
	clear: both;
	text-align: right;
         background-image: url(http://○○○.net/○○○.gif);　　　/* 投稿記事部の下画像変更 */ 
}
.entry .foot li {
	display: inline;
	font-size: 11px;
	color: #999;
}

/*====================================*/
/* コメント                           */
/*====================================*/

/*====================================*/
/* トラックバック                     */
/*====================================*/

/* =================================== */
/* カレンダー                          */
/* =================================== */

.calendar {
	width: 170px;
	text-align: center;
}
.calendar .month {
	font-size: 12px;
	font-family: Verdana;
	color: #666;　　　/* カレンダーの年・月　表示色 */
}
.calendar .week {
	margin-top: 3px;
	font-size: 10px;
	font-family: Arial;
	color: #666;　　　/* カレンダーの曜日　表示色 */
}
.calendar .week div {
	width: 22px;
	float: left;
}
.calendar .day {
	margin-top: 2px;
	font-size: 10px;
	font-family: Verdana;
	color: DarkOrchid;　　　/* カレンダーの日付　表示色 */
}
.calendar .day div {
	width: 20px;
	height: 18px;
	line-height: 18px;
	float: left;
	background: White;　　　/* カレンダーの背景色 */
	border: 1px solid #FF00FF;　　　/* カレンダーの背景枠線色 */
}

/* =================================== */
/* その他                              */
/* =================================== */
.clear {
	clear: both;
	font-size: 0;
}

スタイルシートでいろんなブログが出来ます・・・　無料ブログ

スタイルシートを変更・・・無料ブログで自分流に

無料ブログ・・・無料サービス　を利用するなら　A-aucホームページ　・・・　皆様のご利用を心よりお待ちしております。

スタイルシート でいろんなブログが出来ます ・・・ 無料ブログ

スタイルシート を変更 ・・・ 無料ブログ で自分流に

無料ブログ ・・・ 無料サービス を利用するなら A-aucホームページ ・・・ 皆様のご利用を心よりお待ちしております。

スタイルシートでいろんなブログが出来ます・・・　無料ブログ

　　スタイルシートを変更・・・無料ブログで自分流に

無料ブログ・・・無料サービス　を利用するなら　A-aucホームページ　・・・　皆様のご利用を心よりお待ちしております。