コミュニティ 学ぶ ツールライブラリ レジャー
検索
日本語
ホームページ > ウェブフロントエンド > htmlチュートリアル > HTMLメーターラベルの色問題の解決方法について

HTMLメーターラベルの色問題の解決方法について

黄舟
リリース： 2017-06-29 14:12:30
オリジナル
3758 人が閲覧しました

メーターラベルの色の問題について

<meter id="meterid" value="1" min="1" max="100" low="30" high="60" optimum="50" style="width:300px;height:150px;color:red;">您的浏览器版本不能显示此控件</meter>
ログイン後にコピー

これは私のコードです。最大値が100で、30未満が低く、60以上が高いことがわかります。次に、問題は次のとおりです:

HTMLメーターラベルの色問題の解決方法について

HTMLメーターラベルの色問題の解決方法について

HTMLメーターラベルの色問題の解決方法について

onchange イベントを追加して、値を監視および判断します。 style属性の設定

主に色の変更方法が分からないためです。スタイリッシュに書く方法がわかりません。 background-color を使用して色を直接使用するのは、ラベル内のテキストの色を変更することです。
例えば、値が低いときに赤くなるようにしたい場合、どうすれば解決できますか?

調べた結果、関連する属性はありません。
canvasを使ってシミュレーションしてみました

調べてみたところ、最適値「optimum」で値が低いと赤くなります。 (何が起こっているのかわかりませんし、スタイルを直接変更する方法はありませんし、オンラインで見つけることもできませんでしたが)

optimum が最高の値で、それに近いほど優れています。ああ、なるほど、最大値から遠ざかるにつれて色が緑→黄→赤と変化していきます。

以上がHTMLメーターラベルの色問題の解決方法についての詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル：
html 色
ソース：php.cn
前の記事：HTML メータータグの色のルールの理解と変更 次の記事：HTML5 の進行状況とメーターのコントロール
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
最新の問題
function_exists() はカスタム関数を決定できません Function test () {return true;} if (function_exists ('test')) {echo "テストは関数です";
から 2024-04-29 11:01:01
0
3
2250
Google Chromeのモバイル版を表示する方法 こんにちは、先生、Google Chrome をモバイル版に変更するにはどうすればよいですか?
から 2024-04-23 00:22:19
0
11
2387
子ウィンドウは親ウィンドウを操作しますが、出力は応答しません。 最初の 2 つの文は実行可能ですが、最後の文は実装できません。
から 2024-04-19 15:37:47
0
1
1998
親ウィンドウには出力がありません document.onclick = function(){ window.opener.document.write('私は子ウィンドウの出力です');
から 2024-04-18 23:52:34
0
1
1885
CSS マインド マッピングに関するコースウェアはどこにありますか? コースウェア
から 2024-04-16 10:10:18
0
0
1955
関連トピック
詳細>
人気のおすすめ
人気のチュートリアル
詳細>
関連するチュートリアル
人気のおすすめ
最新のコース
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート