kuu♪ さん
-
nice! 811
記事 104
テーマ パソコン・インターネット
プロフィール
ブログを紹介する
現在の閲覧者数:
総閲覧数:
総閲覧数:
目次
【カスタムスキン初心者の方はこちらをどうぞ】
┣カスタムスキンの始め方
┣カスタムスキン作成方法・1 [バナー編]
┣カスタムスキン作成方法・2 [背景編]
┣カスタムスキン作成方法・3 [文字色編]
┣カスタムスキン作成方法・4 [Links編]
┣カスタムスキン作成方法・5 [Articles編.1]
┣カスタムスキン作成方法・6 [Articles編.2]
┣カスタムスキン作成方法・7 [nice・コメント編]
【カスタムスキンのＱ＆Ａ】
┣カスタムスキンの質問箱
┣カスタムスキンの質問箱2
┣カスタムスキンの始め方
┣カスタムスキン作成方法・1 [バナー編]
┣カスタムスキン作成方法・2 [背景編]
┣カスタムスキン作成方法・3 [文字色編]
┣カスタムスキン作成方法・4 [Links編]
┣カスタムスキン作成方法・5 [Articles編.1]
┣カスタムスキン作成方法・6 [Articles編.2]
┣カスタムスキン作成方法・7 [nice・コメント編]
【カスタムスキンのＱ＆Ａ】
┣カスタムスキンの質問箱
┣カスタムスキンの質問箱2
【カスタムスキンを作るための基礎知識】
┣cssの内容
┣文字色の変え方
┣文字リンク色の変え方
┣文字のサイズの変え方
┣文字の右寄せ・左寄せ・真ん中寄せ
┣字体の変え方
┣線の種類と記述方法
┣背景色の指定と画像の挿入方法
┣画像が小さくなるときの対処法
┣”margin” と ”padding”の違い
【背景】
┣背景色を変えよう
┣背景に画像をのせてみよう
┣背景画像を固定してみよう
┣背景を半透明にしよう
┣記事上下の矢印画像を変えよう
┗スクロールバーの色を変えよう
【文字色】
┣ブログ全体の文字色を変えよう
┣ブログ全体の文字のリンク色を変えよう
┣文字リンクの下線を変えよう
【ヘッダー・フッダー】
┣ヘッダーに画像を入れよう（ＯＯさん部分）
┣ヘッダーに画像を入れよう（ブログトップ部分）
┗ヘッダーを透過させよう
【バナー】
┣オリジナルバナーを作ろう
┣バナーの位置を変えよう
┣バナーをリンクボタンにしてみよう
┣ブログタイトル＆サブタイトルの文字色を変えよう
┣ブログタイトル＆サブタイトルの文字の位置を変えよう
【タブ】
┣タブをつけてみよう
┣プルダウンタブをつけてみよう
【記事】
┣記事の外線の色と太さと種類を変えよう
┣記事の外枠を画像で作ろう
┣記事部分全体に背景色や背景画像をつけよう
┣記事タイトルの文字色を変えよう
┣記事タイトルの文字リンク色を変えよう
┣記事タイトルの幅を変えよう
┣記事タイトルの背景色を変えよう
┣記事タイトルの下の線を変えよう
┣記事タイトルに小さな画像を入れてみよう
┣記事本文の文字色を変えよう
┣記事本文の文字リンク色を変えよう
┣記事本文の文字の位置を変えよう
┣記事中の広告を透過しよう
┣記事の一番下の線の色を変えよう
┣記事の一番下の日付の文字色を変えよう
┣記事の一番下の日付の位置を変えよう
┣nice コメント コメントを書く の下の線の色を変えよう
┣nice コメントを書くの文字の位置を変えよう
┣niceの画像を変えよう
┣【コメント】の前に画像を入れよう
┣【コメントを書く】の前に画像を入れよう
┣コメント記入欄の文字色を変えよう
┣コメント記入欄に画像を入れよう
┣コメント記入欄の縦・横の幅を広げよう
┣コメント記入欄の外枠の線の色と太さを変えよう
【サイドバー】
┣サイドバーに外枠をつけよう
┣サイドバーの外枠を画像で作ろう
┣サイドバーに背景色をつけよう
┣サイドバータイトルとバナーの間に空白を作ろう
┣サイドバータイトルに小さな画像を入れてみよう
┣サイドバータイトルに背景色をつけよう
┣サイドバータイトルの文字色を変えよう
┣サイドバータイトルの文字リンク色を変えよう
┣サイドバー本文の文字色を変えよう
┣サイドバー本文の文字リンク色を変えよう
┣サイドバー本文の文字の位置を変えよう
┣カスタムペイン内の文字に左右の余白を作ろう
┣NEWの文字色を変えよう
┣3ペインのサイドバーの位置を変えよう
┣プロフィールの中の矢印画像を変えよう
┣プロフィールの中の矢印画像を消そう
┣プロフィールに画像を入れる方法
┣プロフィール内の「nice!」の文字色と外線の色と背景色を変えよう
┣カレンダーの更新した日付部分の画像を変えよう
┣カレンダーを装飾してみよう
┣「読者になる」の画像を変えよう
┣「読者になる」の背景色を変えよう
┣「読者になる」の文字リンク色を変えよう
┣「POWERED BY so-neblog」 と「RSS」 の左右の位置を変えよう
【ブログの小技】
┣記事ＴＯＰにお知らせをつけよう
┣ブログにひとこと話せる「Twitter」をつけよう！
┣月別表示を変えよう〔ドロップダウンにする〕
┣カテゴリーを変えよう〔ドロップダウンにする〕
┣サイドバーのドロップダウンの枠の幅と文字を小さくする
┣サイドバーのコメント欄をツリー表示にしよう
┣「メッセージを送る」の画像を変えよう
┗「ＲＳＳプレイヤーとRSS2.0（RSSフィード）
┣画像タグの謎を解く
┣リッチテキストエディタでテーブルを組む【基本】
┣リッチテキストエディタでテーブルを組む【テーブルのプロパティ】
┗リッチテキストエディタでテーブルを組む【セルのプロパティ】
【おまけ】
┣カスタムスキンのためのミニミニ素材
┣kuuの作ったカスタムスキンのパーツ倉庫
┣マウスカーソルをハーボット（harbot）にしよう！
┣コメントにハーボット絵文字
┣ピグミーの絵文字
┗ハーボットのアクセスカウンターとオンラインカウンター
ｱｸｾｽ解析
kuu♪からのお知らせ
長年公開してきたカスタムスキンへの道ですが、
新しいサイト Harbot's field内の「ssブログ（so-netブログ）のカスタマイズ方法」 へ引っ越しをします。
徐々に時間をかけて引っ越す予定で、今よりも見やすいサイトに変更しています。
今後ともよろしくお願いいたします。
新しいサイト Harbot's field内の「ssブログ（so-netブログ）のカスタマイズ方法」 へ引っ越しをします。
徐々に時間をかけて引っ越す予定で、今よりも見やすいサイトに変更しています。
今後ともよろしくお願いいたします。
カスタムスキン作成方法・2 [背景編] [最初の一歩]
必要な部分のみ変更してください。
□カスタムスキンの始め方
□カスタムスキン作成方法・1 [バナー編]
もご覧ください。
【3】背景を変えよう（全体の背景）
#ffffff; を変更します。
|  （クリックで拡大） |
↓ ↓ ↓ ↓ ↓ ↓
☆色の指定
#ffffff というのは色の指定です。好きな色の色番号に変えましょう。
その時、「#FF0000」というふうに、＃を必ず入れましょう。
私は色を選ぶのは『HTML 色一覧』もしくは『HTMLCOLOR』をＤＬして使っています。
『HTMLCOLOR』はパソコン上にある好きな色番号を教えてくれるのでスキン作成にはかかせません。
[見本]
①#000000;（黒） を入れてみます。（お好きな色を入れてみてくださいね）
|  （クリックで拡大） |
②”プレビュー”で確認
③気に入った色が決まったら”保存”
【参考】
＊ 背景色を変えよう
＊ 背景に画像をのせてみよう
【4】内側の背景色を変えよう（しなくてもＯＫです）
①バナーの下（記事、サイドバー、記事・サイドバーの周り）部分の色を変え、余白を作る。
| （クリックで拡大） |
↓ ↓ ↓ ↓ ↓ ↓
/*-----Content-----*/ 内に背景色を指定します。元々何も記述がないので下記タグをすべてコピーして貼り付けます。
|  （クリックで拡大） |
②バナーと①で色をつけた部分の間を詰める
|
↓ ↓ ↓ ↓ ↓ ↓
margin-bottom:20px; → margin-bottom:0px;
|
③”プレビュー”で確認
④気に入った色が決まったら”保存”
【5】外枠に線を入れよう（しなくてもＯＫです）
＊これをする場合は、【4】内側の背景を変えよう をしてください。
その時に、背景色の指定はしなくてもいいです。
①赤い境界線を入れてみます
|  （クリックで拡大） |
↓ ↓ ↓ ↓ ↓ ↓
border: 1px solid #FF0000; を付け加えます
＊線の太さ、種類、色は【線の種類と記述方法】を参考にご自分で変えてください。
＊必要な部分のみ線を入れてもＯＫです。
|  （クリックで拡大） |
②”プレビュー”で確認
③気に入った色が決まったら”保存”
ありがとうございます♪♪
記事が役に立たれたら、下のバナーの興味があるものをクリックしてもらうとうれしいです。
リンクについて
もしリンクを貼っていただけるのであれば
こちらのバナーをお使いください。
こちらのバナーをお使いください。
こんにちは。
ちょっとご無沙汰している間に、
変則３ペインになっているなんて驚きです。
使い勝手に合わせて、こういうスタイルもアリですね（＾＾）
by ぜろこ (2008-12-15 12:49)
★ぜろこさん
私の使いたいように変えたらこんなになってしまいました^^
自分でアレンジできるって楽しいですね♪
by kuu♪ (2008-12-17 11:48)