• 締切済み

スクロールバーの色を変更

サイトのTOPでスクロールバーの色の変更をして、それは出来たのですが… TOPに更新履歴を表示するテキストエリアボックスのスクロールバーまで色が変わってしまいます。 ここに関しては通常の青いスクロールバーにしたいのですが、どうすればいいのか分かりません…。 スクロールバーの色の変更は<HEAD>内にこれを使いました。 <style type="text/css"> <!-- body { scrollbar-arrow-color:#000; scrollbar-face-color:#90eeaa; scrollbar-highlight-color:#fff; scrollbar-3dlight-color:#000; scrollbar-track-color:#fff; scrollbar-shadow-color:#000; scrollbar-darkshadow-color:#fff; } --> </style>

  • HTML
  • 回答数4
  • ありがとう数0

みんなの回答

  • goldfox
  • ベストアンサー率49% (123/249)
回答No.4

<TEXTAREA rows="3" cols="100"> 文章 </TEXTAREA> cols="" 入力フィールドの横幅を数値で指定 rows="" 入力フィールドの高さを数値(行数)で指定 http://www.tagindex.com/html_tag/form/textarea.html スタイルシートでwidth:/*幅*/;height:/*高さ*/;でも指定できます。 http://www.tagindex.com/stylesheet/form/width_height.html

na-na228
質問者

補足

出来ました☆ありがとうございます!! 親切に本当助かりました!!

  • goldfox
  • ベストアンサー率49% (123/249)
回答No.3

> これを通常の青いものにするには、どうしたらいいのでしょうか… ?? 色はデフォルト(通常の青いもの)に変更できたんですよね? スクロールバーをなくしたいなら、 overflow:hidden; /* スクロールバー非表示指定 */ を textarea{} に付け足せば消せますよ。

na-na228
質問者

補足

<style type="text/css"> <!-- body { scrollbar-arrow-color:#000000; scrollbar-face-color:#90eeaa; scrollbar-highlight-color:#ffffff; scrollbar-3dlight-color:#000000; scrollbar-track-color:#ffffff; scrollbar-shadow-color:#000000; scrollbar-darkshadow-color:#ffffff; } textarea { scrollbar-arrow-color:transparent; scrollbar-face-color:transparent; scrollbar-highlight-color:transparent; scrollbar-3dlight-color:transparent; scrollbar-track-color:transparent; scrollbar-shadow-color:transparent; scrollbar-darkshadow-color:transparent; } --> </style></head> <body> <form><textarea> </textarea></form> </body> この場合テキストエリアのサイズを変える場合どこに入れたらいいんですか?

  • goldfox
  • ベストアンサー率49% (123/249)
回答No.2

textareaのセレクタで それぞれのcolor値をtransparentに指定してください。 textarea { scrollbar-arrow-color:transparent; scrollbar-face-color:transparent; scrollbar~

na-na228
質問者

補足

やってみたところ出来ました!!が、更新に使う場合、行数は3行にしかしない為スクロールバーをつけない方がいいことに気づきました…(泣) でもテキストエリアのみにしてみても、下げる矢印?右の上下にあるものまで色が変わってしまします。 これを通常の青いものにするには、どうしたらいいのでしょうか… <BODY> <FORM> <TEXTAREA rows="3" cols="100"> 文章 </TEXTAREA> </FORM> </BODY>

  • cccat00
  • ベストアンサー率0% (0/0)
回答No.1

フォーム内にテキストエリアを作成して、そのテキストエリアのスクロールバーの色を変えたいということでよろしいでしょうか。 スタイルタグ内の"body"指定と同様に、"textarea"を指定すればよろしいかと思います。 以下のように作成して確認したところ、色を変えることができました。 <head> <style type="text/css"> <!-- body { scrollbar-arrow-color:#000000; scrollbar-face-color:#90eeaa; scrollbar-highlight-color:#ffffff; scrollbar-3dlight-color:#000000; scrollbar-track-color:#ffffff; scrollbar-shadow-color:#000000; scrollbar-darkshadow-color:#ffffff; } textarea { scrollbar-arrow-color:#000000; scrollbar-face-color:blue; scrollbar-highlight-color:#ffffff; scrollbar-3dlight-color:blue; scrollbar-track-color:#ffffff; scrollbar-shadow-color:#blue; scrollbar-darkshadow-color:#ffffff; } --> </style></head> <body> <form><textarea> text </textarea></form> </body>

na-na228
質問者

補足

スクロールバー自体を変えたいので色を変えるという方法は… テキストエリアのスクロールバーは、このページにもあるようなスクロールバーにしたいのです(泣)

関連するQ&A

  • HP作成(スクロールバーの色)

    HP作成初心者です。 画面のスクロールバーの色をスタイルシートを使って変更したいのですが、言語がよく分かりません。 以下の「face-color」や「highlight-color」などはどの部分の色を指定しているのでしょうか? 分かる方教えてください。参考になるURLなども教えていただければうれしいです。 <STYLE type="text/css"> <!-- body { scrollbar-face-color:#756fea; scrollbar-highlight-color:white; scrollbar-shadow-color: #756fea; scrollbar-3dlight-color: #756fea; scrollbar-arrow-color:white; scrollbar-darkshadow-color: #756fea; scrollbar-track-color: #4d44e3; } --> </STYLE>

  • TEXTAREAのスクロールバーの色は変えない方法

    次のようにすると、TEXTAREAのスクロールバーも色が変わってしまいます。 ブラウザのスクロールバーのみ変えて、TEXTAREAのスクロールバーの色は変えない、できるだけ洗練されたエクセレントな方法を教えて下さい! body { scrollbar-highlight-color:#ffffff; scrollbar-arrow-color:#ffffff; scrollbar-3dlight-color:#0066ff; scrollbar-base-color:#0066ff; scrollbar-face-color:#0066ff; scrollbar-shadow-color:#0066ff; scrollbar-darkshadow-color:#299095; }

    • ベストアンサー
    • CSS
  • スタイルシートのスクロールバー

    現在HPを作成しています。 スタイルシートでスクロールバーの色を変更させたいのですが、出来ません。 何処かおかしいでしょうか? 宜しくお願いします。 <style type=text/css> <!-- body{ scrollbar-face-color:#fba32b; scrollbar-highlight-color:white; scrollbar-shadow-color:white; scrollbar-3dlight-color:white; scrollbar-arrow-color:#fba32b; scrollbar-track-color:white; scrollbar-darkshadow-color:white; } --> </STYLE>

  • ココログのスクロールバー

    「ココログ」を使っています。 カスタム編集にした時、CSSをつかって スクロールバーの色を変えたいのですが、上手く反映されず通常のままです。 (ちなみにオンマウスの設定など、他のCSSは反映されています) 何か間違っているでしょうか? それとも「ココログ」ではスクロールバーの変更は対応してないのでしょうか? ----------------------------------------------- <STYLE type=text/css> <!-- BODY{ scrollbar-face-color: #ffffff; scrollbar-highlight-color: #ffffff; scrollbar-shadow-color: #000000; scrollbar-3dlight-color: #000000; scrollbar-arrow-color: #000000; scrollbar-track-color: #ffffff; scrollbar-darkshadow-color: #ffffff; } --> </STYLE> -----------------------------------------------

  • インラインフレーム内のスクロールバーの色変更について

    インラインフレーム内のスクロールバーの色を白に変更したいのですがインラインフレームを置いている親ページのスクロールバーの色が変わってしまいます インライフレーム内の元ページのスクロールバーの色も変更していますが出来ません インラインフレーム内のページタグ <HEAD><style type="text/css"> <!-- body { scrollbar-base-color: #ffffff scrollbar-arrow-color: #ffffff; } --> </style> 親ページのタグ <IFRAME frameborder="0" src="file:///J:/hompage/haikyo.html" width="470" height="470" scrolling="AUTO" scrollbar-base-color: #ffffff style="scrollbar-darkshadow-color : white;scrollbar-face-color : white;scrollbar-3dlight-color : white;scrollbar-highlight-color : white;scrollbar-arrow-color : white;scrollbar-shadow-color : white;scrollbar-base-color : white;scrollbar-track-color : white;"></IFRAME> ネットでも検索してみましたが検索の仕方がわるいのかうまく出来ません アドバイスお願いします

    • ベストアンサー
    • HTML
  • IE6でのスクロールバーの色

    IE5.5の時は、スクロールバーの色が変わってたんですが、 IE6にしたら、色が変わらなくなりました。 どうしたらよいでしょうか。 教えてください。 よろしくお願いします。 ■補足説明■ スタイルシートは外部から読み込むようにしてます。 記述は以下のとおりです。 body{scrollbar-base-color:#000000; scrollbar-face-color:#000000; scrollbar-track-color:#000000; scrollbar-arrow-color:#8080ff; scrollbar-3dlight-color:#8080ff; scrollbar-highlight-color:#000000; scrollbar-shadow-color:#000000; scrollbar-darkshadow-color:#8080ff; font-size:12px; color:#8080ff; background-color:#000000}    ・    ・    ・    ・ フォントサイズ、フォントの色、背景色は認識されてます。

  • スクロールバーの色の変更について

    パソコンによってスクロールバーの色の変更ができるのとできないのとがあるのはソースの問題でしょうか? ちなみにソースは以下のとおりです。 <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS"> <title>××</title> <STYLE type="text/css"> <!--BODY{ scrollbar-face-color:#FFCECE; scrollbar-highlight-color: #ffffff; scrollbar-shadow-color: #ffffff; scrollbar-3dlight-color: #ffffff; scrollbar-arrow-color: #ffffff; scrollbar-track-color: #ffffff; scrollbar-darkshadow-color: #ffffff; font-family: "MS ゴシック", "Osaka-等幅"; color: #660033; background-image: url(IMAGES/××.gif); }--> </STYLE> </head>

    • ベストアンサー
    • HTML
  • スクロールバーのスタイルシートについて。

    スクロールバーの色を変えるスタイルシートで質問です。 下記スタイルシートを使うとそれが出来るのですが、たとえば HPをフレームで2つに分けた場合、全部のページにスタイルシートを 書かなければいけないんでしょうか?一番最初のページだけではうまく いきませんでした。分かる方お手数ですが教えて頂けないでしょうか。 <style type="text/css"> body { scrollbar-face-color: #ffffff; scrollbar-highlight-color: #330066; scrollbar-shadow-color: #330066; scrollbar-3dlight-color: #ffffff; scrollbar-arrow-color: orange; scrollbar-track-color: #ffffff; scrollbar-darkshadow-color: #ffffff; } </style>

    • ベストアンサー
    • HTML
  • スクロールバーの色

    スクロールバーの色の変更で、ソースは以下なのですが、 <head> <style type="text/css"> <!-- body {scrollbar-3d-light-color:#000000; scrollbar-arrow-color:#ffffff; scrollbar-base-color:#ff0000; scrollbar-dark-shadow-color:#00ff00; scrollbar-face-color:#00ff00; scrollbar-highlight-color:#00ffff; scrollbar-shadow-color:#ffff00;} --> </style> </head> それぞれどこの色を示しているのですか? Faceは、マウスを置いて動かす部分の色のようですが・・・。他はどうなんでしょう?色が混ざってしまうのですか。 また、このソースを1ページずつ<head>~</head>の中に入れなければいけませんか?

    • ベストアンサー
    • HTML
  • 横スクロールバーを表示したい

    スクロールバーの色を変更するために下記のタグを埋め込んだ所、 今まで表示されていた横スクロールバーが消えてしまいました。 横スクロールさせないと見えない部分があるので、ぜひ表示させたいです。 どうか教えてください! Win98se・IE6 HPビルダーでどこでも配置モードを利用しています。 <STYLE type="text/css"><!--body {scrollbar-face-color:#ffffff; scrollbar-track-color:#ffffff; scrollbar-arrow-color:#C0C0C0; scrollbar-highlight-color:#808080; scrollbar-shadow-color:#C0C0C0; scrollbar-3dlight-color:#ffffff; scrollbar-darkshadow-color:#ffffff; overflow-x : hidden ;} --> </STYLE>

    • ベストアンサー
    • HTML

専門家に質問してみよう