• 締切済み

セレクトボックスの文字

セレクトボックスの中の文字を小さく(8ptくらい)したいのですが どうしたら小さくなるのでしょうか? スタイルシートを使っても小さくならないみたいなんですが・・・。 文字を小さくする方法がありましたら教えてください。

  • HTML
  • 回答数1
  • ありがとう数3

みんなの回答

  • shiba1
  • ベストアンサー率41% (10/24)
回答No.1

スタイルシートを使っても駄目ですか? ブラウザによって解釈されないのかもしれません。 selectに直接、styleで記述してみたらどうでしょう? 試してください。 <form> <select style="font-size:8pt"> <option>aaa</option> <option>bbb</option> <option>ccc</option> </select> </form>

関連するQ&A

  • セレクトボックス内の文字の文字の大きさを変更したい

    セレクトボックス内の文字の文字の大きさを変更したいのですが、上手くいきません。付属画像にある、上のセレクトボックス(緑色)は自分のコードの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
  • セレクトボックスの内容を中央寄せ

    IE系ブラウザで表示する場合ですが、 セレクトボックスの内容を中央寄せしたいのですが、どうしたらよいでしょうか。 直接HTMLに書くよりも、スタイルシートでの指定にしたいと思っています。 それができなければ、HTMLに書いてもよいです。 よろしくおねがいします。 select.html --------------------------------------------------- <select name="selectmenu" class="selectbox"> <option value="param1">ここの文字を中央寄せ</option> <option value="param2">ここの文字が中央寄せ</option> <option value="param3">ここの文字が中央寄せ</option> <option value="param4">ここの文字が中央寄せ</option> </select> ---------------------------------------------------- style.css ---------------------------------------------------- .selectbox{ ここで中央寄せを指定 } ----------------------------------------------------

  • セレクトボックスを非表示にしたい。

    セレクトボックスを非表示にしたい。 <TR> </TR> の中にあるセレクトボックスを単に非表示にしたいと思っています。 どう書けばできるかわかりません。 CSSでもjabascriptでもできるだけ単純な書き方を見つけようと だいぶググりましたが、わかりませんでした。 簡単にできる方法は無いでしょうか? どなたかご教授お願いいたします。

    • ベストアンサー
    • HTML
  • セレクトボックスのハイライトの色を変更

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

    • ベストアンサー
    • CSS
  • セレクトボックス内のフォント位置

    はじめまして。 検索窓のフォームデザインで テキストフォールド、セレクトボックス、ボタン と横並びにしており、各ボックスの高さを デフォルトより少し大きくしようと思い、テキストフィールドの 文字を中央にするにはpaddingで調節できたんですが セレクトボックスの文字がIE8だと下揃えに firefoxだと上揃いになり、中央に揃えたいんですが 方法がわかりません。 文字を中央にしたいのはよくある最初の <option value="-" selected>選択して下さい</option> の箇所だけです。 セレクトボックスのフォントサイズを大きくしてごまかす事も可能ですがテキストフィールドの文字も大きくしないとバランスがおかしくなってしまいます。 ご存知の方がいましたらよろしくお願いします。

    • 締切済み
    • CSS
  • セレクトボックスの幅を指定した状態で、選択肢の文字列を全て表示する方法

    お世話になっております。 環境: Windows2000 IE6.0 HTMLでセレクトボックス(SELECTタグ)を使用しているのですが、選択肢(OPTIONタグ)の文字列が長いと、セレクトボックスの幅も長くなってしまいます。 STYLESHEETでWIDTHを指定してみたのですが、選択肢の文字列が途中で切り取られてしまい、使えません。 セレクトボックスの幅を指定し、プルダウンで表示される選択肢の文字列は全て表示されるような方法があれば教えて下さい。 ■ソース■ <html> <head> <STYLE TYPE="text/css"> <!-- SELECT { width: 100px; } --> </STYLE> <title>サンプル</title> </head> <body> <select name="" selected> <option name="0">選択肢1</option> <option name="0">長い文字列XXXXXXXXXXXXXXXXXXXXXXX</option> <option name="0">選択肢3</option> <option name="0">選択肢4</option> </select> </body>

    • ベストアンサー
    • HTML
  • セレクトボックスで警告

    Javascriptの初心者です。 セレクトボックスが二つ(a,b)あるとして、 セレクトボックスa中の項目いずれかを選択肢すると、 セレクトボックスbのどの項目をも選択できないようにするため、 警告をだしたいのですが、 よい方法をご教授していただけなでしょうか。 よろしくお願いいたします。

  • セレクトボックス

    こんにちは。いつもお世話になっております。 セレクトボックスについて質問なのですが、JavaScrptを用いて セレクトボックスのどれかを自動的に選択する事は可能でしょうか? 具体的には、年月日をとりだして、セレクトボックスの対応する項目を自動選択したいのです。 どなたかご存知の方いらっしゃいましたら、どうか教えてください。 よろしくお願いします。

  • チェックボックスとセレクトボックスの使い分け

    ふと疑問に感じたので質問させていただきます 皆様はどういう風にセレクトボックスとチェックボックスの 使い分けを行っていますか?(単一選択時) 私の場合、 文字数が多いときや、選択項目が多いときはセレクトボックス チェックボックスは選択項目が短いとき、 または全体を一目で把握したいとき としているのですが、正直結構そのときの気分に左右されます 何かこういうときはこっちを使うといいという考えがあれば教えて下さい よろしくお願いいたします

  • 決済フォームのセレクトボックスの矢印

    決済フォームのセレクトボックスの矢印を(付属画像のように三角の大きい目立つデザインにしたいです。 付属画像の緑色のフォームは自分のコードのWEBの表示画像です。 どうしたらよいでしょうか?回答よろしくお願いいたします。 コードは下にあります。HTML CSS <!DOCTYPE html> <html> <head> <meta content="text/html; charset=utf-8"/> <title>お問い合わせ</title> <link rel="stylesheet" href="syoki.css"> <link rel="stylesheet" href="syokigazou.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" class="auto-style1"> <p class="px-num"> 支払方法:※ </p> <div class="auto-style2"> <select name="pay" class="pay" 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> </form> </body></html> ◎◎cssのコード(syokicss) /* セレクトボックスのデザイン */ #pay { border: 3px solid #63e02d; /* 枠線 */ padding: 0.5em; /* 内側の余白量 */ background-color: snow; /* 背景色 */ width: 24.3em; /* 横幅 */ height: 56px; /* 高さ */ font-size: 1.2em; /* テキスト内の表示文字サイズ */ color: #000000; line-height: 1.2; /* 行の高さ */ } /* 入力フォームとフォーム間のの上下の余白, */ input.email{margin:8px 0px;} /* セレクトボックスの上下の余白, */ select.pay{margin:8px 0px;} /* pxで指定 入力フォーム、セレクトボックスの上の文字タイトルの行間の大きさ、文字サイズ、太さ*/ .px-num{ line-height: 0px;/* 文字の行間 */ font-size: 22px;/* 文字の大さ */ font-weight: 900;/* 文字の太さ */ text-align: center;/* 文字を中央に配置 */ color: #63e02d; }

    • ベストアンサー
    • CSS