• ベストアンサー

セレクトボックスのハイライトの色を変更

セレクトボックスのハイライトの色を変更できますか。 「セレクトボックスのハイライト」とは、セレクトボックスのある値を選択したときに、テキストを選択したときと同じように紺色の色でハイライトされる状態のこと。文字変換の時の状態の反転も同様。 ハイライトというよりも反転と言ったほうが適切かもしれません。 ※　STYLE="Background-Color : yellow"　のことではなく。

  • CSS
  • 回答数1
  • ありがとう数0

質問者が選んだベストアンサー

  • ベストアンサー
回答No.1

ワープロソフトやメモ帳などで文字を選択したときの反転のようなものがセレクトボックス内でポイントしたときついて回ることですよね？ で，これをs-holmesさんが作ったホームページで，例えば，ページ毎に別々に指定したいと言うことですよね？ もし，そういうことでしたら，たぶん，方法が無いような気がします。 私もいろいろと調べてみましたが，そのような方法をかかれた記述を見つけられませんでしたし，また，OSの設定によってこの選択時の反転の色を変えることが出来ますので，なんとなく無理なのではないかと思います。

  1. カテゴリ
  2. [技術者向] コンピューター
  3. プログラミング・開発
  4. CSS

関連するQ&A

  • セレクトボックスの値による入力フォーム背景色の切り替え

    セレクトボックスで選択された値を見て、 text入力欄の背景色を変えたいのですが、 JavaScriptの書き方がよくわかりませんので 教えていただけないでしょうか。 ----------------------------------------- セレクトボックス(SELECT_AREA)の値選択時に onChengeで呼び出して テキスト入力欄（MEMBER_NAME）の色を変えたい。 <html:select property="SELECT_AREA"> <html:text property="MEMBER_NAME" size="100" maxlength="20" style="background:#FF0000" /> ----------------------------------------------- よろしくお願いします。

  • テキストボックスいくつかのうち１つだけフォーカス

    input:focus{background-color:yellow;border-color:red;} はできますが、 テキストボックスいくつかのうち１つだけフォーカス時に色を付ける方法はありますか？ よろしくお願いします。

    • ベストアンサー
    • CSS
  • セレクトボックス内の文字の文字の大きさを変更したい

    セレクトボックス内の文字の文字の大きさを変更したいのですが、上手くいきません。付属画像にある、上のセレクトボックス（緑色）は自分のコードのWeb表示画像なのですが、同じく付属画像の下にある、セレクトボックス（青色）は選択するセレクトボックス内の文字が少し大きく表示されています。（他の会社のHP画像です。）ちなみにセレクトボックス自体の大きさはどちらも同じ大きさです。 文字を大きくしたいのですが、どうしたらよいでしょうか？また、文字を大きくすると、勝手にボックス横幅が広がってしまうでしょうか？ 以下がコードになります。 <!DOCTYPE html> <html> <head> <meta content="text/html; charset=utf-8"/> <title>お問い合わせ</title> <link rel="stylesheet" href="syoki.css"> <style> /* セレクトボックスの位置 */ .auto-style2 { margin: auto; text-align: center; } </style> </head> <body> <form> <h2>支払方法：※</h2> <div class="auto-style2"> <select name="list" id="pay"> <option value=""></option> <option value="クレジットカード"<?php if(isset($pay) && $pay==="クレジットカード") { echo "selected" ;} ?>>クレジットカード</option> <option value="銀行振込"<?php if(isset($pay) && $pay==="銀行振込") { echo "selected" ;} ?>>銀行振込</option> </select> </div> <p></p> <p></p> <p></p> <span colspan="2"><input type ="submit" name ="submit"value="確認画面へ"></span> </form> </body></html> ◎（syoki.css）◎ /* セレクトボックスのスタイル */ #pay { border: 2px solid #63e02d; /* 枠線 */ padding: 0.5em; /* 内側の余白量 */ background-color: snow; /* 背景色 */ width: 28.8em; /* 横幅 */ height: 56px; /* 高さ */ font-size: 1em; /* テキスト内の表示文字サイズ */ color: #000000; line-height: 1.2; /* 行の高さ */

    • ベストアンサー
    • CSS
  • [Javascript]テキストボックスにフォーカスが来たら色を変えたい。

    こんばんわ。 テキストボックスなどにフォーカスが当たったら、そのテキストボックスの背景色を変えたいのです。 onForcus と style を組み合わせてイロイロしましたがダメでした・・・。 onfocus=""とonblur=""で動きを認識して・・・ style="background-color : aqua;" や style="background-color : white;" で背景色を変えたいのですが・・・。 宜しくご伝授くださいませ。

  • セレクトボックスの矢印を大きな▼の緑色の矢印にした

    同じような質問ですいません。 入力フォームとセレクトボックスの横幅と縦幅を変更せずに セレクトボックスの矢印を大きな▼の緑色の矢印にしたいです。 何度も同じ質問してすみません。レスポンシブ対応が上手くいかなかったので、少しコードを整理しました。(前回と少し違うコードになります）。 付属画像のような感じにしたいです。 コードは以下にあります。回答よろしくお願いいたします。 <!DOCTYPE html> <html> <head> <meta content="text/html; charset=utf-8"/> <link rel="stylesheet" href="box.css"> <style> /* 入力フォームの位置 */ .auto-style1 { margin: auto; text-align: center; } /* セレクトボックスの位置 */ .auto-style2 { margin: auto; text-align: center;/* セレクトボックス中央に配置 */ } </style> </head> <body> <form action ="hpform1.php" method ="post"> <div class="auto-style1"> <p class="px-num"> メールアドレス：※ </p> <input type="text" class="email" name="email" id="email" value="<?php if(isset($email)){ echo $email; } ?>"/> </div> <p class="px-num"> 支払方法：※ </p> <div class="auto-style2"> <select name="pay" class="pay" id="pay"> <option value="">支払方法</option> <option value="クレジットカード"<クレジットカード></option> </select> </div> </form> </body></html> ◎◎入力フォームとセレクトボックスのｃｓｓ（boxcss) /* 入力フォームのスタイル */ #email { margin:0 auto;/* レスポンシブ対応中央 */ text-align: center;/* レスポンシブ対応中央 */ border: 3px solid #63e02d; /* 枠線 */ padding: 0.5em; /* 内側の余白量 */ background-color: snow; /* 背景色 */ width: 29.3em; /* 横幅 */ height: 56px; /* 高さ */ font-size: 1em; /* テキスト内の表示文字サイズ */ line-height: 1.2; /* 行の高さ */ box-sizing: border-box;/* レスポンシブ対応中央 */ } /* セレクトボックスのデザイン */ #pay { margin:0 auto;/* レスポンシブ対応中央 */ text-align: center;/* レスポンシブ対応中央 */ border: 3px solid #63e02d ; /*#63e02d 枠線 */ padding: 0.5em; /* 内側の余白量 */ background-color: snow; /* 背景色 */ width: 24.3em; /* 横幅 */ height: 56px; /* 高さ */ font-size: 1.2em; /* テキスト内の表示文字サイズ */ color: #000000; line-height: 1.2; /* 行の高さ */ box-sizing: border-box;/* レスポンシブ対応中央 */

    • ベストアンサー
    • CSS
  • 条件付き書式を設定しても、テキストボックスの色が変更されない！

    テキストボックス１　（FLG）と テキストボックス２　（AAA）があります。 テキストボックス１(FLG)の値が1以外の時にテキストボックス２の色を青色に変更しようとしています。 手順は、 　テキストボックス２を選択状態にして、 　[書式]－[条件付き書式]で 　　条件を　[式]　にして、 　　判定方法は　FLG<>1　 　　塗りつぶし、背景の色で　青色を選択 です。 （ちなみに、テキストボックス１自信の色の変更は 　[書式]－[条件付き書式]で 　　条件を　[フィールドの値]　にして、 　　判定方法を　1と等しくないとき 　としてもうまくいったのですが・・・。） よろしくお願い致します。

  • 複数の連動する同じ内容のセレクトボックスについて

    こんばんわ。 よろしくお願いします。 複数の同じ内容のセレクトボックスが連動するモノを作りたいのですが、まったく解りません。 たとえば 初期値を『選択しない』とし、１～５までの値を選択出来るセレクトボックスが５つあるとします。 １つ目のセレクトボックスで『３』を選択したら、残りのセレクトボックスでは３を除いた１～５までの値を選択出来ます。 さらに２つ目のセレクトボックスで『２』を選択したら、残りのセレクトボックスでは２と３を除いた１～５までの値を選択出来きるといった、全てのセレクトボックスが連動した重複を許さないセレクトボックスを作りたいのですが、可能でしょうか？

  • 青色などに反転（ハイライト）した部分を含むテキスト

    青色などに反転（ハイライト）した部分を含むテキストがありますが、それをコピペしたり印刷したりしようとするととんでしまいます（欠落する）。 どうしたら黒色のテキストにできますか。

  • テクストボックスからセレクトボックスへ

    １．テキストボックスにテキストを入力 ２．追加ボタンを押す ３．セレクトボックスに表示 ４．セレクトボックスに追加した項目を選択し削除ボタンで削除できる 以下のようなプログラムを教えていただけますでしょうか？

  • セレクトメニューで選んだ値をテキストボックスへ

    ４個のセレクトメニューで選択した値（文字列）を、自動で１個のテキストボックス（INPUT）に連結して入力する方法はありますか？ 例えば　SelectMenuAで、「あい」を選択。 　　　　　 SelectMenuBで、「うえ」を選択。 　　　　　 SelectMenuCで、「おか」を選択。 　　　　　 SelectMenuDで、「きく」を選択。 その後に配置してあるテキストボックスに「あいうえおかきく」が表示される かたちです。 当方javascriptを勉強中の身で、サンプルプログラムをお見せいただけ ればと思います。 テキストボックスの値の連結ならできるのですが、セレクトメニューの選択値で 同じことをすることに手こずってます。

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

あなたにピッタリな商品が見つかる！ OKWAVEセレクト

質問する