GT-ONE 楽天タグ講座 パイプ奮闘記

Freepage List

【写真集】


■ 玄関 ■ 


■プチ講座MENU


【日記の雛形・罫線】


【もう一つのプロフィール】


■【おもしろタグ教室MENU】


バナーって何!


プレート教室VOL.1


プレート教室VOL.2


アニメGIF製作VOL.3


画像


アップロードとは  


アイコンの使い方!


壁紙の使い方!


【バナー&プレート置き場】


.    


.      


.    


  


.


【壁紙チェンジャー】


【リンク集】


   


.   


     


.         


【キリ番】


   


  


   


  


  


  


  


  


  


 


  


  


  


マーキー


グラデーションフォント 


色々なスクロール1


色々なスクロール2


色んなスクロール3


  


   


【カラーサンプル】カラーコード表


【カラーサンプル】カラーネーム表


(*mm)   


!  


スクロールを消す


  


  


TABLEでページ一覧を隠す


.


φ(..)


.


スイッチで表示


【日記リンクの皆様】 


( ̄‥ ̄)=3 フン


      


 


           


■【HPの飾り付け教室MENU】


   


TABLEで整理整頓  


アニメGIFって何!


      


画像を貼り付けてみよう


リンクを貼って見よう


楽天での壁紙について


壁紙の位置指定


 


【飾付VOL10】


test


雛形1


Rum Rose


remon


【My PIPE Collection】


【マイ パイプ コレクション001~010】


【マイ パイプ コレクション011~020】


【マイ パイプ コレクション021~030】


【マイパイプ コレクション #31~#40】


レストアの仕方


2004/01/25

 
XML
カテゴリ:カテゴリ未分類

    前回【日記で使う!ボックスのお勉強 2(幅と高さの特性)】 と 
    【日記で使う!ボックスのお勉強 3(幅と高さの特性)】 でテキストや画像を
    ボックスの中に入れた場合の特性をお話しました。
 
    テキストの場合ボックスの幅、高さを指定すると、縦方向(Y方向)のみ押し広げられました。
    画像の場合は、ボックスより画像が大きければ、いくらボックスの大きさを指定しても
    画像の持つ大きさに押し広げられましたよね!
 
    では!押し広げられないように、ボックスの幅、高さを維持するにはどうすればいいのでしょうか?
    ボックスをスクロールさせればいいのです。( ̄m ̄*)V

 
 

 
此処に文字を書きます。
 
改行して、テキストのスペースを
 
たくさん取ってみますと、
 
指定した大きさ以上になりますと
 
スクロールバーが現れます。
 
お判りでしょうか?
 
ちなみにこのボックスは、幅200px高さ150pxのボックスに指定しています。
 

 ↑こちらのボックスは、テキストのみ入れて見ました。
 
 こちらは ↓画像も入れて見ました。
 画像の大きさは270×185 です。

 
此処に文字を書きます。
 
改行して、テキストのスペースを
 
たくさん取ってみますと、
 
指定した大きさ以上になりますと
 
スクロールバーが現れます。
 
お判りでしょうか?
 
↓画像を入れますと画像の大きさに反応しまして、横(X方向)のスクロールバーも現れます。
 

 
ちなみにこのボックスは、幅200高さ150のボックスに指定しています。
 


 
    お判りでしょうか?
    当たり前のことですが、ボックスをスクロールさせれば、ボックスの大きさを維持できます。
    限られた、スペースにテキストボックスなどを置く場合に威力を発揮しますね!
 
    ちなみに、↑上のスクロールボックスは、縦方向(Y軸方向)のみ常に表示するようにタグを指定しています。
    横方向(X軸方向)は、「AUTO」 にして、必要があればスクロールしなさいと命令をしています。
 
    
 タグを書いて見ましょう。


    

 
<div style="border-style:double;border-color:black;border-width:;width:200px;height:150px;background-color:beige;background-image:url(http://背景画像のURL);overflow-y:scroll;overflow-x:auto;scrollbar-base-color:white;scrollbar-arrow-color:black;scrollbar-face-color:white;scrollbar-track-color:;">
ここにテキストや画像を書きます。
</div>


 
    overflow-y:scroll;overflow-x:auto; で表示しているところがスクロールしなさいと命令しているタグです。
    scrollbar-base-color:white;scrollbar-arrow-color:black;scrollbar-face-color:white;scrollbar-track-color:;
    はスクロールバーの色を指定しています。
    width:200px;height:150px; はボックスの幅と高さですね!
    背景画像を出すタグも入れてありますが、URLを指定しなければ
    background-color:beige; 背景カラーが有効になります。
    皆さんも色々挑戦してみて下さいませ!
    では!( ̄m ̄*)V ε=ε=ε=(┌ ̄)┘ダッシュ!
 
    日記の飾り付け【プチ講座メニュー】はこちらから!
    ご注意:プチ講座は2003/11/28のタグ規制で使えないものがあります。
        ご承知おきください。








Last updated  2004/09/06 05:04:21 PM
コメント(14) | コメントを書く


PR

Profile


gtone

Calendar


Copyright (c) 1997-2020 Rakuten, Inc. All Rights Reserved.