スクロールするボックス

スクロールするボックス に関する記事です。
HOME > スポンサー広告 > title - スクロールするボックスHOME > [役立つタグ] > title - スクロールするボックス
上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。
もっといいアフィリエイトでおこづかいを稼ぐ情報を探しに行く?^^
に関連したブログ内の記事へ

[RSS] [Admin] [NewEntry]

スポンサー広告 | Page Top↑ Yahoo!ブックマークに登録 スポンサーサイトの記事をはてなブックマークに登録 この記事をライブドアクリップに登録 このエントリーを含むFC2ブックマーク
雪山スクロールするボックスを作るには、overflow属性(HTML)タグを、使うんだよ。^^








overflow属性には、4つのタイプがあるよ。

visible:枠の外側まで、はみ出して表示する。

scroll:入りきらない文章を、折りたたんで、上下に移動出来るようにする。

hidden:はみ出した文章は、表示しない。

auto:バーを、自動表示にする。



まずは、この中の「scroll」を使うよ。^^


●基本

<p style="width:ここに横幅の数値px;height:ここに縦幅の数値px;;overflow:scroll;">ここに文字</p>を、使おう!^^

例えば、このような記述をすると・・・


<p style="width:200px;height:100px;overflow:scroll;">ここにお好みの文字を挿入します。
すると、右側に、バーが現れます。

こうする事によって、少ないスペースの中に、たくさんの文字を入れて、みてもらうことが出来るんだよ。^^</p>


こんなふう↓に、なります。^^

ここにお好みの文字を挿入します。
すると、右側に、バーが現れます。

こうする事によって、少ないスペースの中に、たくさんの文字を入れて、みてもらうことが出来るんだよ。^^




●背景色をつけるには?

background-color:ここに背景色;を、入れようね。^^

<p style="width:ここに横幅の数値px;height:ここに縦幅の数値px;background-color:#ここに背景色;overflow:scroll;"></p>


<p style="width:200px;height:100px;background-color:#ffff00;overflow:scroll;">ここにお好みの文字を挿入します。
すると、右側に、バーが現れます。

こうする事によって、少ないスペースの中に、たくさんの文字を入れて、みてもらうことが出来るんだよ。^^</p>


こんなふう↓に、なります。^^

ここにお好みの文字を挿入します。
すると、右側に、バーが現れます。

こうする事によって、少ないスペースの中に、たくさんの文字を入れて、みてもらうことが出来るんだよ。^^




●下のバーを、消したい

autoを、使えば、可能だよ。^^
※ブラウザーによっては、表示できない場合も、あります。


<p style="width:ここに横幅の数値px;height:ここに縦幅の数値px;background-color:#ここに背景色;overflow:auto;"></p>


<p style="width:200px;height:100px;background-color:#ffff00;overflow:auto;">ここにお好みの文字を挿入します。
すると、右側に、バーが現れます。

こうする事によって、少ないスペースの中に、たくさんの文字を入れて、みてもらうことが出来るんだよ。^^</p>


こんなふう↓に、なります。^^

ここにお好みの文字を挿入します。
すると、右側に、バーが現れます。

こうする事によって、少ないスペースの中に、たくさんの文字を入れて、みてもらうことが出来るんだよ。^^



文章を改行する時は、<br>を、挿入するか、ENTERキーを、押してね。^^

この方法を使えば、少ないスペースで、たくさんのサービスや、商品を紹介したい時に、便利だよ。^^


ちなみに、こんなふう↓にすると・・・

<p style="width:ここに横幅の数値px;height:ここに縦幅の数値px;;">ここに文字</p>

バーのない、枠だけの表示が、出来るよ。^^

「文章が、ゴチャゴチャしてて、見づらいな」
と感じたら、枠線で囲ってみるのも、いいかもね?^^

スポンサーサイト
もっといいアフィリエイトでおこづかいを稼ぐ情報を探しに行く?^^
タグ に関連したブログ内の記事へ

[RSS] [Admin] [NewEntry]

[役立つタグ] | トラックバック:0 | コメント:11 | Page Top↑ Yahoo!ブックマークに登録 スクロールするボックスの記事をはてなブックマークに登録 この記事をライブドアクリップに登録 このエントリーを含むFC2ブックマーク
コメント
この記事へのコメント
管理人のみ閲覧できます
このコメントは管理人のみ閲覧できます
2008/05/30(金) 17:02 | | #[ 編集]
レンジャーさん、こんばんわ。
私もインフルエンザでした。
体調管理には気を付けていたと思っていたのですが・・・
今日は病院に行ったら医者に
「日曜日ぐらいまでは安静にしていて下さい」
と言われました。
他の人にも移す訳にはいかないので、週末までは自宅で安静にしています。
応援ポチッ!
2008/05/30(金) 18:37 | URL | かず #Nl6qMWng[ 編集]
こんばんは^^

これはとっても解りやすいです!!
あるところで これを見たのですが
理解できなくて・・・
ここでやっと 理解できたような気がします^^
今度 利用してみたいなと思います
どんな風に使おうかな?

応援ポチポチポチッ♪
2008/05/30(金) 19:44 | URL | まつり花 #.rEgMis2[ 編集]
管理人のみ閲覧できます
このコメントは管理人のみ閲覧できます
2008/05/30(金) 21:21 | | #[ 編集]
こんばんは!
いつも分かりやすいご説明で、パソコン音痴の私にも理解できます。
ありがとうございます。
暇な時間が出来たら、少しずつ、取り入れていきたいと思います。今日は、バリューコマースに登録して、バナーを貼りにトライ!サイドバーにバナーを貼ったら、サイドバー自体がぐちゃぐちゃに・・・・焦りました~
もう~嫌だとばかりに諦めました。
時間に余裕のあるときに、再度トライです。
応援~☆~☆
2008/05/31(土) 00:26 | URL | サユサユ #mQop/nM.[ 編集]
かずさん、まつり花さん、サユサユさん、こんにちは^^
かずさん、こんにちは^^

インフルエンザでしたか・・・
普通の風邪と違って、治りにくいし身体への負担が大きいから、辛いですよね・・・><

土日は、どうぞ安静になさってください。^^

本当に健康はお金では買えませんから・・・><

のちほど、応援にうかがいます♪^^


まつり花さん

実は自分も、この方法が解からなくって、以前ずいぶんと、調べてみたんです。

やっと、タグが把握できたので、記事にすることが出来ました。^-^

喜んでいただけまして、嬉しいです♪


使い方としては、更新情報や、複数ASPの紹介・自己紹介のコーナーなど
「狭いスペースを効率的に使いたいとき」に有効ですよ。^^

そうそう。
「プチ日記コーナー」なんていうのも楽しいかも?しれませんね。^^

のちほど、応援にうかがいます♪^^


サユサユさん

バリューコマースも、よいASPですよね。^^

バナーサイズによっては、サイドバーからはみ出るものもありますから、対策に困りますよね。><


代用案として

・小さいバナーにする

.テキスト(文字)リンクに変える

.専用記事を書いて、その記事へのURLをサイドバーに貼り付ける

例:バリューコマースの詳細はこちら

<a href="ここに記事のURL">バリューコマースの詳細はこちら</a>

といった方法も、あります。^^


のちほど、応援にうかがいます♪^^
2008/05/31(土) 11:40 | URL | アフィリエイトレンジャー #-[ 編集]
アフィリエイトレンジャーさん

こんにちは、
KoU@ちょいコガマスターです♪

コメントが嬉しすぎて、
記事にさせてもらいました(*^▽^*)
http://choicoga.livedoor.biz/archives/51136750.html

ありがとうございます♪


最近は、マイクロソフトのフロントページを使っていましたが、
しっかりと勉強すると、応用範囲が広くなりますね^-^

レンジャーさんのブログは本当に勉強になります!

今日も素敵なブログありがとうございます♪

応援ポチッ(*^▽^*)
2008/05/31(土) 12:24 | URL | KoU@ちょいコガマスター #-[ 編集]
管理人のみ閲覧できます
このコメントは管理人のみ閲覧できます
2008/05/31(土) 13:03 | | #[ 編集]
KoUさん、こんにちは^^
前回の記事、非常に素晴らしかったですよ。^^

コメントにも書いたんですが、せっかく良い記事なのに「続きは無料レポで」という場合が多いので、ガックリすることが多かったんです。

前回の記事は、レベルが非常に高くて、読まれた方も「こんなに凄い情報を無料で読ませてくれるんだから、商材の内容もすごいのに違いない」と思われることでしょう。^^

のちほど、応援にうかがいます♪
2008/06/02(月) 12:28 | URL | アフィリエイトレンジャー #-[ 編集]
はじめまして
はじめまして、いつも参考にしています。これからも遊びにきます。
2008/10/24(金) 12:31 | URL | hana #-[ 編集]
面白かったです
いつも見ています。継続して日記凄いですね。僕も努力しないと・・・。もう寒いので体に気をつけて下さい。応援しています。
2008/11/12(水) 08:57 | URL | あきお #-[ 編集]
コメントを投稿する
URL:
Comment:
Pass:
秘密: 管理者にだけ表示を許可する
 
トラックバック
この記事のトラックバックURL
http://affiliateland.blog52.fc2.com/tb.php/93-ffedaf3d
この記事にトラックバックする(FC2ブログユーザー)
この記事へのトラックバック
SEO対策:アフィリエイト SEO対策:副業 SEO対策:在宅ワーク
  1. 無料アクセス解析
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。