レンタル無料ブログサービス比較；2006/ 01の記事一覧

■文字をスクロールさせます。

タイトルやサブタイトル（サイト説明文）などに使うと効果的です。

文字の大きさ20px、赤色指定
　↑
<MARQUEE style="font-size:20px;color:#ff0000;padding:5px;">文字の大きさ20px、赤色指定</MARQUEE>

スクロールの速さを指定する
　↑
<marquee scrollamount="5" scrolldelay="50" behavior="scroll"
loop="0">スクロールの速さを指定する</marquee>

　※scrollamount="5"　数値を大きくするとスクロールの速度が速くなります
　※scrolldelay="50"　数値を小さくするとスクロールの速度が速くなります

1度だけ動かし、スクロールを止める（※IE のみ有効）
　↑
<marquee scrollamount="5" scrolldelay="50" behavior="slide"
loop="1">1度だけ動かし、スクロールを止める（※IE のみ有効）</marquee>
　※サンプルページ

▼ランダム画像表示スクリプト

<SCRIPT language="JAVASCRIPT">
<!--
Se=Math.floor(Math.random()*10);
if(Se==0||Se==1){Se1="0";}
if(Se==2||Se==3){Se1="1";}
if(Se==4||Se==5){Se1="2";}
if(Se==6||Se==7){Se1="3";}
if(Se==8||Se==9){Se1="4";}

Co=new Array(5);
ga=new Array(5);

Co[0]="http://www.amazon.co.jp/exec/obidos/ASIN/4798010332/wonderland-22?dev-t=DVZ02IW2V71DT%26camp=2025%26link_code=xm2"; // リンク先0
ga[0]="http://images-jp.amazon.com/images/P/4798010332.09.MZZZZZZZ.jpg"; // 表示画像0

Co[1]="http://www.amazon.co.jp/exec/obidos/ASIN/4896272714/wonderland-22/"; // リンク先1
ga[1]="http://images-jp.amazon.com/images/P/4896272714.09.MZZZZZZZ.jpg"; // 表示画像1

Co[2]="http://www.amazon.co.jp/exec/obidos/ASIN/4798108987/wonderland-22?dev-t=DVZ02IW2V71DT%26camp=2025%26link_code=xm2"; // リンク先2
ga[2]="http://images-jp.amazon.com/images/P/4798108987.09.MZZZZZZZ.jpg"; // 表示画像2

Co[3]="http://www.amazon.co.jp/exec/obidos/ASIN/4839916543/wonderland-22?dev-t=DVZ02IW2V71DT%26camp=2025%26link_code=xm2"; // リンク先3
ga[3]="http://images-jp.amazon.com/images/P/4839916543.09.MZZZZZZZ.jpg"; // 表示画像3

Co[4]="http://www.amazon.co.jp/exec/obidos/ASIN/4798010928/wonderland-22?dev-t=DVZ02IW2V71DT%26camp=2025%26link_code=xm2"; // リンク先4
ga[4]="http://images-jp.amazon.com/images/P/4798010928.09.MZZZZZZZ.jpg"; // 表示画像4

document.write('<A href="'+Co[Se1]+'">');
document.write('<IMG src="'+ga[Se1]+'" border="0"></A>');
// -->
</SCRIPT>

代替文字とは画像がうまく表示されないときのために画像（IMGタグ）の「alt属性」に記述する文字の事を言います。（下部参照）
　
しかし、下記のように背景色が代替文字と同じような色の場合、代替文字が認識しずらくなってしまいます。

このような場合の対処方法として代替文字に対して文字色を指定する方法があります。

■代替文字に対して文字色を指定する方法（スタイルシート）

<div style="color:#fff;">
<img src="画像.gif"
alt="代替文字" width="100" height="30" border="0">
</div>

　※上記のソースでは、文字色として白色を指定しています。

■表示例

背景色に濃い色を使っている場合などは、代替文字に文字色を指定すると良いでしょう。

FC2ブログ共有テンプレート登録BLOGテンプレート
　※（110_pink-3ca；3カラム）

■特徴
　※3カラム;（プラグイン対応、枠固定タイプ）背景はピンクのハート
　　（バレンタインデー用にいかがでしょう？）
　※トップページにのみ表示される「フリースペース」を設置
　※meta タグの赤字部分は、ご自身で編集して頂く必要があります。
　　<meta name="keywords" content="keywords,キーワード記入"/>
　　（重要なキーワードを記入；多すぎるとSEO逆効果;最高でも10個以内）
　　特に SEO を意識しない方は、そのまま修正しなくても、差し支えございません。

　　※110_pink-3ca プレビュー

記事にご満足頂けましたら、クリックをお願い致します
　 人気blogランキングへ　 FC2 ブログ ランキング

　 FC2ブログをはじめよう！>>>登録はこちら
　 ブログで作るビジネス専用のホームページ 『 ドリームブログ 』

　 無料ブログ比較・評価＆サンプルblog
　　※アクセスアップ SEO対策同好会
　　※ホームページ作成講座

背景画像を指定するスタイルシートとフリー素材（背景画像）

■背景画像を指定するスタイルシート

body{
background: #ff8833 url("背景イメージへのパス") fixed;
}

　#ff8833　背景画像が表示されない場合、ここで指定した背景色を表示
　fixed　背景画像を固定する場合に使用

■自作背景画像（拡大表示）
　画像をクリックすると、実際の背景イメージをご覧いただけます。
　ほとんどのイメージが１kバイト以下の軽い画像です。ご自由にご利用ください。
　※ただし、直リンクは厳禁です。必ずダウンロードしてご利用下さい。

■HTMLリファレンス - カラー編（RGB）
※備考；RGBとは
　コンピュータで色を表現する際に用いられる表記法の一つ。
　色を赤(R)・緑(G)・青(B)の3つの色の組み合わせとして表現する。
　この3色は光の三原色と呼ばれ、この組み合わせですべての色を表現できます

■リンクする要素に対してスタイルを適用します
/* 記述例 */
a {
text-decoration: underline; color:#0000ff;
}

リンクするテキストにアンダーラインを表記し、青字で表示する
（underline ⇒ none　；アンダーラインを表記しない）

■リンクする要素のうち、未閲覧（キャッシュされていない）要素に対してスタイルを適用します
/* 記述例 */
a:link {
color : #ff6633!important;
}
（important＝サイト制作者のスタイルよりもユーザーが設定した色を優先する）

■リンクする要素のうち、閲覧済（キャッシュされている）要素に対してスタイルを適用します
/* 記述例 */
a:visited {
color : #ff8800 !important; text-decoration: none;
}

閲覧済リンクテキストにアンダーラインを表記せず、オレンジ色で表示する

■リンクする要素のうち、未閲覧（キャッシュされていない）要素に対してスタイルを適用します
/* 記述例 */
a:hover {
color : #ff0000 !important; text-decoration: underline;
}

未閲覧リンクテキストにアンダーラインを表記し、赤色で表示する

■カーソルをその要素の上に置いているが、まだアクティブ状態でない時のスタイル
/* 記述例 */
a:hover {
color : #ff3333 !important; text-decoration: underline;
}

■アクティブ状態にされた時（クリックした時）のスタイル
a:active {
color : #ffff00 !important;
}

■フォント（文字）装飾 - モザイク文字

▼ソース
<DIV STYLE='WIDTH:400px;FONT-SIZE:24pt;padding:5px;FONT-WEIGHT:bold;
FONT-FAMILY:Times New Roman; COLOR:#0000FF; FILTER:progid:DXImageTransform.Microsoft.Pixelate(maxsquare=2)'>無料ブログSEOテンプレート</DIV>

　　※モザイクの強さ： maxsquare

▼実行例



■ブログ:スタイル シート（CSS）

■フォント（文字）装飾 - 波打ち文字

▼ソース
<DIV STYLE='WIDTH:400px;FONT-SIZE:25px;padding:5px;FONT-WEIGHT:bold;
FONT-FAMILY:Times New Roman; COLOR:#0000FF; FILTER:progid:DXImageTransform.Microsoft.Wave(ad=0,freq=5,lightstrength=30,phase=4,strength=2)'>ブログ
テンプレート カスタマイズ</DIV>

　※波の数：phase　※光の強弱：lightstrength　※波の幅：strength

▼実行例


■ブログ:スタイル シート（CSS）

■フォント（文字）装飾 - 発光文字

▼ソース
<DIV STYLE='WIDTH:400px;FONT-SIZE:26px;padding:5px;FONT-WEIGHT:bold;FONT-FAMILY:Times
New Roman;COLOR:#FF0000;FILTER:progid:DXImageTransform.Microsoft.Glow(color=#FFEE20,strength=10)'>ブログ
テンプレート カスタマイズ</DIV>

　　※発光の強さ： strength

▼実行例



■ブログ:スタイル シート（CSS）

■フォント（文字）装飾 - 影付き文字

▼ソース
<DIV STYLE='WIDTH:400px;FONT-SIZE:26px;padding:5px; FONT-WEIGHT:bold; FONT-FAMILY:Times
New Roman; COLOR:#FF0000; FILTER:progid:DXImageTransform.Microsoft.shadow(color=#aaaaaa,direction=135,strength=6)'>ブログ
テンプレート カスタマイズ</DIV>

▼実行例


影の方向： direction　　影の長さ： strength

CSSとはカスケーディング・スタイルシート（Cascading Style Sheets）の略で、HTMLで定義されるWebコンテンツの視覚的な表現を指定するための仕組みのことです。

HTMLファイルのHTMLタグに、スタイルシートで、「フォントの大きさ」や「文字の色」などのホームページの見た目に関する記述を埋め込みプラウザ上で表現します。

また、HTMLファイルとは別に「〜.css」というファイルを作成し、 HTMLファイルからこの「〜.css」ファイルを読み込むことでスタイルシートを適用させることもできます。（外部スタイルシート）

外部スタイルシートを利用すれば、ホームページを模様替えする時に一括で変更でき、また、統一したホームページで作成できるので、ホームページの管理が非常に楽になります。

CSSファイル（外部スタイルシート）を別途設置することにより「.htmlファイル」が簡素化され『SEO:検索エンジン最適化』の効果もあがります。

■ 無料アクセスアップSEOブログ
　※ 無料で出来るアクセスアップやSEO対策情報を紹介するブログ
　　◇ ブログ アクセスアップ・SEO
　　◇ 無料アクセスアップツール

■ インターネット サービス
　※ インターネットで利用できるサービス情報をご紹介します
　　◇ ネットショップ
　　◇ コミック・アニメ・漫画（マンガ）

ライブドアブログでは、デフォルトの状態だと、同じ日に投稿した記事は、同一枠内に区切りなしに表示されてしまいます。このままだと、記事の区別がつきにくいので、同日投稿でも記事の区切りができるようにしてみましょう。

まず、管理画面「デザインの設定」より、「トップページ」をクリックして、HTML の編集画面を表示し、以下の青字の部分（上部にあり）を探します。

　　--- 上部略 ---
<div id="content">
<div class="blog">

<!-- Loop Start -->
<IndexArticlesLoop>

<$TrackBackAutoDiscovery$>
<IfDateChanged><h2 class="date"><$ArticleDate$></h2></IfDateChanged>

<div class="blogbody">
　　--- 以下略 ---

h2タグを挟んでいる、<IfDateChanged>と</IfDateChanged> の部分を削除します。

これで、同日投稿でも記事の区切りができるようになります。

アクセスアップSEO対策リンク集 （※現在、休止中）

■FC2ブログ サポートフォーラム
　※FC2ブログに関するサポートフォーラムです。
　　 わからない事があったら、まず、こちらで調べてみてください。

FC2からのお知らせ
　※FC2からの一般的なお知らせやメンテナンス・障害の際のお知らせ

一般カテゴリー
　 FAQ・よくある質問　（質問する前にチェック）
　 質問掲示板　（FC2ブログに関する質問フォーラム）
　 不具合・要望掲示板　（不具合と思われるもの・要望等はこちら）

デザイン・カスタマイズ
　 テンプレート掲示板　（テンプレートのカスタマイズはこちら）
　 カウンター・アクセス解析掲示板　（カウンター・アクセス解析等の話題はこちら）
　 その他ブログパーツ掲示板　（ブログパーツ等の話題はこちら）

その他
　 雑談掲示板　（話題や雑談はこちら）
　 ブログ宣伝掲示板　（FC2ブログの宣伝が可能）


◎ ブログ カスタマイズ 方法