• 締切済み

セレクトメニューボタンの枠の色の変更の仕方を教えて下さい。

セレクトメニューボタンの枠の色の変更の仕方を教えて下さい。 <HEAD>と</HEAD>の間に <style type=text/css> <!-- input,select,textarea { filter:Alpha(opacity=数字,enabled=数字); font-size:文字サイズpt; color:#文字の色; font-family:'文字の種類'; background-color:#背景色; border-top:1px solid #fe97b3; border-bottom:1px solid #fe97b3; border-left:1px solid #fe97b3; border-right:1px solid #fe97b3; } --></STYLE> と入れてます。 <input>の枠の色は変わりますが、<select>のみが変わりません。 どこが悪いのでしょうか

みんなの回答

回答No.3

まぁfilterが記述している時点でブラウザ依存ですね。

全文を見る
すると、全ての回答が全文表示されます。
  • key-child
  • ベストアンサー率54% (25/46)
回答No.2
全文を見る
すると、全ての回答が全文表示されます。
  • MAN_MA_RUI
  • ベストアンサー率41% (426/1024)
回答No.1

答え:ブラウザ依存です。 IE:XPビジュアルスタイル表示で変化なし・クラシック表示は未確認 Gecko(Firefox,Netscapeなど):へこんだような色つき枠線になることもあれば、単線色つきになる場合もある。 Opera:単線色つきになるけど表示がクラシックスタイル調になる。 WebKit(Safariなど):Macもってないからしらない><

全文を見る
すると、全ての回答が全文表示されます。

関連するQ&A

  • cssによる画像リンク枠の色変更

    CSSでリンクが貼られた画像の4隅のボーダーに色を付け、 オンマウスで4隅のボーダー色が変わる方法ってどうやってやるのでしょうか? 一番簡単なCSSを教えて下さい。 ちなみに、下記でやってみましたが、よくわかりません。 <style type="text/css"> <!-- IMG a{ border-width : 7px 7px 7px 7px;border-style : solid solid solid solid;border-color : fuchsia fuchsia fuchsia fuchsia; } --> </style> </head> <body> <a href="#"><img src="jpg" width="54" height="72" border="0"></a>

  • 【急ぎます!】ページ幅を解除と、メニューの色を変更するには

    http://flash.xtaro.com/sozai/tool/fcount/sample.htmここを参考にHPを作っています。 <!-- BODY { MARGIN-TOP: 3px; COLOR: #000000; BACKGROUND-COLOR: #e6eee6; TEXT-ALIGN: center ;} TABLE { BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; MARGIN: 0px; WIDTH: 700px; BORDER-COLLAPSE: collapse; BORDER-RIGHT-WIDTH: 0px ;} TD { FONT-SIZE: 11pt; MARGIN: 0px; WIDTH: 140px; BORDER-COLLAPSE: collapse; BACKGROUND-COLOR: #66cc99; TEXT-ALIGN: center ;} DIV { BORDER-RIGHT: #999999 1px solid; BORDER-TOP: #999999 1px solid; BORDER-LEFT: #999999 1px solid; WIDTH: 700px; BORDER-BOTTOM: #999999 1px solid; BACKGROUND-COLOR: #ffffff ;} .menu { BORDER-RIGHT: #66cc99 0px solid; PADDING-RIGHT: 3px; BORDER-TOP: #66cc99 0px solid; PADDING-LEFT: 3px; PADDING-BOTTOM: 3px; BORDER-LEFT: #66cc99 0px solid; WIDTH: 100%; COLOR: #ffffff; PADDING-TOP: 3px; BORDER-BOTTOM: #66cc99 0px solid; BACKGROUND-COLOR: #339966; TEXT-DECORATION: none ;} .menu:hover { COLOR: #004411; BACKGROUND-COLOR: #bbffdd ;} .close { BORDER-RIGHT: #ff0000 1px solid; BORDER-TOP: #ff0000 1px solid; FONT-WEIGHT: bold; FONT-SIZE: 11pt; BORDER-LEFT: #ff0000 1px solid; COLOR: #dd0000; BORDER-BOTTOM: #ff0000 1px solid; BACKGROUND-COLOR: #ffffff; TEXT-DECORATION: none ;} .close:hover { COLOR: #ffffff; BACKGROUND-COLOR: #ff0000 ;} --> (1)メニュー1や2の色を変更するにはどうすればいい? (2)ページ背景色をhttp://www.kds.kddi.com/topics/index.htmlのようにグラデーションにするにはどうすればいい? (3)ページ幅を変更するにはどうすれいい?

    • ベストアンサー
    • HTML
  • <select>タグの枠の色について

    <select>タグで、枠の色が必ずデフォルトでグレーになりますが、 この枠の色を、水色などの色に変えることは可能でしょうか? それと、これに関連して、<optgroup label="xx">を使用した場合 xxの部分が、太字で斜体になってしまいますが、このフォントを 変えることは可能でしょうか<optgroup label="xx" style=color:red> とした場合、リスト全部のフォント色が赤になってしまいました。

  • CSS アンカーの画像の回りが色枠で囲まれてしまう

    <a>タグでリンクボタン(画像)を作りました。 ソースはこんな画像とURLを指定したのみです。 <a href="http://xxxxx/"><img src="/image/menu01.gif"></a> ブラウザで見ると、画像の周りが青枠で囲まれてしまっています。 (一度、クリックすると赤っぽい色に、その枠の色が変わります) 既存のページを元にHTMLを作成しているのですが、たぶん、定義して ある CSS or javascript などの設定ファイルが悪さをしているような気がしていますが、何が原因か分かりません。 そのHTMLに指定してあるCSSをコピペさせていただきますが、どこが原因か分かりますか? そのほか、怪しいところがありましたら、ご指摘ください。 よろしくお願いいたします。 ----style.css--- body { background-color: #ffffff; background-repeat: no-repeat; font-family: Arial, Verdana; font-size: 14px; font-style: normal; font-weight: normal; /* color: #333333; */ /* margin-top: 10px; */ /* margin-left: 10px; */ /* margin-right: 10px; */ /* margin-bottom: 10px; */ } /* Style for in-page header of the generated rowset pages */ .pagehead { font-size: 16px; font-weight: bold; } /* Table row style referenced in generated various generated pages */ .tablebody { /* background-color: #CCDDEE; */ color: #111111; font-size: 14px; text-align: left; vertical-align: middle; padding: 5px 10px 5px 10px; } /* Default grid header and footer style for generated rowset pages */ .gridStyle-tr-header, .gridStyle-tr-footer { background-color: #CCDDEE; color: #555588; font-size: 14px; text-align: left; vertical-align: baseline; line-height: 18px; border-color: #999999; border-style: solid; border-width: 1px; padding-left: 10px; } /* Grid base row default style for generated rowset pages */ .gridStyle-tr-data { background-color: #FFFFFF; color: #111111; font-size: 14px; text-align: left; border-color: #999999; border-style: solid; border-width: 1px; padding-left: 12px; } /* Grid alternate row default style for generated rowset pages */ .gridStyle-tr-alt-data { background-color: #CCDDEE; color: #111111; font-size: 14px; text-align: left; border-color: #999999; border-style: solid; border-width: 1px; padding-left: 12px; } /* Used for prompts in generated pages */ .prompt { color: #993333; font-style: italic; } A:link, A:visited, A:active { color: #7777AA; text-decoration: underline; } A:hover { color: #9999FF; background: transparent; text-decoration: underline; } ----common.css--- body { color:#111; background-color:#777; margin:0; } form { margin:0; } a { color:#111; } a:hover, a.Hover { color:#666; } a.My { color:#25a; } a.My:hover, a.MyHover { color:#58d; }

    • ベストアンサー
    • HTML
  • この部分の画像を入れるには・・??

    <!--* はじめ *--> <table><tbody><tr><td> <div style="border:1px solid #ff6699;width:400px"><div style="border-width:3px;border-style:solid;border-color:#fff #ffbbbb #ffbbbb #fff;background:#ffcccc;padding:4px"><div style="border:3px dotted #fff;padding:4px"><div style="border-width:3px;border-style:solid;border-color:#ffbbbb #fff #fff #ffbbbb"><div style="border:1px solid #ff6699;background:#fff;font-size:13px;color:#ff6699;padding:15px"> <img src="写真URL" width="幅(ピクセル)" height="高さ(ピクセル)" border="0" align="left" style="margin:0 7px 0 0"> <b>HN</b> ☆ プロフィール <hr style="border-style:solid;color:#ff6699;height:1px"> <b>職業/学校</b> ☆ プロフィール <hr style="border-style:solid;color:#ff6699;height:1px"> <b>住んでるとこ</b> ☆ プロフィール <hr style="border-style:solid;color:#ff6699;height:1px"> <b>性別</b> ☆ プロフィール <hr style="border-style:solid;color:#ff6699;height:1px"> <b>年齢</b> ☆ プロフィール <hr style="border-style:solid;color:#ff6699;height:1px"> <!--* おわり *--> すいません。上記のタグは、HP用のプロフィールなんですが、写真を入れることのできるプロフィールなんです。。 が、上のほうに、写真URLというのが、あって、多分そこに写真を入れるんですが、写真URLって何ですか?マイピクチャーに入れてる写真を使うのですがURLなんかないです。。 どうしたらいいんでしょうか?

  • ブログでのスクロール枠の設置の仕方

    <div style="margin:0px;padding:0px;" align="left"><div style="margin:0px;padding:0px;line-height:1.3;width:200px;background-color:#FFFFFF;"><div style="margin:0px;padding:10px;line-height:1.3;overflow:auto;border: 2px solid #66CCCC;font-family:'MS Pゴシック',Osaka,sans-serif;text-align:left;font-size:100%;height:5em;scrollbar-arrow-color:#66CCCC;scrollbar-3dlight-color:#66CCCC;scrollbar-darkshadow-color:#66CCCC;scrollbar-face-color:#FFFFFF;scrollbar-track-color:#FFFFFF;scrollbar-track-color:#FFFFFF;scrollbar-shadow-color:#FFFFFF;">文章挿入</div></div></div> スクロール枠です。 これをブログにはめ込んでるんですが、この枠をもう一つ横並びに貼り付けたいのですが、段落ちしてしまいます。 改行はしてないので、それでの段落ちではないです。 お分かりになる方、よろしくお願いします。 ライブドアブログです。

  • フォームボタンの白い枠の消し方。

    今晩和。現在、ブログの色などのデザイン変更をしております。 現在、スタイルシートを変更していて、フォームボタンの内側に白い線?のようなものが表示され、気になっています。 フォームボタンは背景が透けて見えるように変更しました。 input{ color:#666666; border:1px dotted #8a8a8a; background-color:transparent; } .button{ color:#666666; border:1px dotted #8a8a8a; background-color:transparent; } テキストのところはちゃんと表示されているのですが、フォームボタンのみ内側に白い枠が表示されています。 以前、HPを作ったことがありますので、試しに枠が表示されないように変更してみたら、ドット枠と一緒に白い枠も消えました。 自分なりにいろいろ調べてみましたが、解決策は見つかりませんでした。 背景画像に写真を使用しているので、重なると目立つので、出来れば白い枠を消したいと思っています。 解決方法をご存知の方がいらっしゃいましたら、ご教授の程宜しく御願い致します。

  • メニューボタン

    ホームページ作成初心者です。 よろしくお願いします。 メニューボタンのことで質問させてください。 テーブルにて横方向にボタン画像を並べました。 ボタン画像はスタイルシートで指定しております(リンクテキストは別) <html> <head> <style type="text/css"><!-- table{ border-collapse:collapse; } .td1{ background-image:url(menu01.gif); padding:0px; border:0px solid #0000FF; background-color:#FFFFFF; width:90px; height:25px; font-size:12px; } --></style> </head> <body> <table> <tr> <td class="td1"><a href="">トップページ</a></td> <td class="td1"><a href="">次のページ</a></td> <td class="td1"><a href="">その次のページ</a></td> </tr> </table> </body> </html> このような場合で、リンクもしくはボタン画像にマウスポインタを 乗せると画像が入れ替わるというようなことは出来ますか? もし、お分かりの方がいましたら教えて下さい。 宜しくお願いします。

    • ベストアンサー
    • HTML
  • 枠の幅が次のようにすると

    画面いっぱいに広がってしまいます どうしたら文字列サイズにあわせて枠幅が決まるようにできるでしょうか? <html> <head> <style type="text/css"> <!-- .title { background-color:lightyellow; border-color:blue; border-style:solid; border-width:1px; } --> </style> </head> <body> <div class="title"> 芹沢鴨 </div> </body> </html>

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

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