検索窓
今日:1 hit、昨日:10 hit、合計:43,336 hit

ラジオボタンとチェックボックス ページ21

##

題名をみて、ラジオボタンとは…となった方も多いかと思います。

input[type=radio]と言われると、わかるでしょうか。

そうですね、あの選択ボタンのことです。
具体的には、CSS辞典で選択肢のボタンを変更、という風に紹介されているものです。

CSS辞典では、画像を使って変更する方法しか書かれていませんが、
実は色でも設定できます。
とはいっても、ほんのちょっと、うっすら、です。

画像を使いたくないけれど、雰囲気に色をちょっと合わせたい、そんな時に便利です。

input[type=radio]{
background:カラーコード;
border:太さ 線の種類 カラーコード;
}


と設定します。
!importantはどちらも要りません。
ソースを見れば分かるように、丸い線も変えることができますが、画面で見るとちょっと小さいので、あまり線を太くしたり、逆に細くしたりすると見えなくなってしまいます。
使いやすさ、見やすさを考えると、線を消す、というのもおすすめできません。
「1px solid #カラーコード」がいいかと思います。

また、同じようにして、チェックボックスも変えられます。
上のソースの、input[type=radio]を、input[type=checkbox]に変えてみてください。
チェックボックスは、読者側からすると見えませんが、編集画面もこだわりたい方はぜひ。
残念ながら、選択していない時のボタンの色は変えられますが、選択している時のボタンには設定が効かないみたいです。
appearanceとかをいじったらぺったんこになったので、それはダサいなぁということでやめておきます。

##

HTMLについて→←フォントによるデザイン崩れ



目次へ作品を作る感想を書く
他の作品を探す

おもしろ度を投票
( ← 頑張って!面白い!→ )

点数: 9.6/10 (106 票)

この小説をお気に入り追加 (しおり) 登録すれば後で更新された順に見れます
131人がお気に入り
設定タグ:CSS , 辞典 , オリジナル作品
違反報告 - ルール違反の作品はココから報告

感想を書こう!(携帯番号など、個人情報等の書き込みを行った場合は法律により処罰の対象になります)

ニックネーム: 感想:  ログイン

さくさく - 参考にさせていただきます。ありがとうございます! (12月13日 19時) (レス) id: 8125d01b3c (このIDを非表示/違反報告)
青い鳥 - 参考にさせてもらいました。関係ないんですけど100票目に評価しました (10月17日 17時) (レス) @page27 id: 55adadd6b3 (このIDを非表示/違反報告)
ぽんきち丸ドリーム号(プロフ) - 参考にさせていただきました、、!ありがとうございます!! (7月10日 9時) (レス) @page27 id: 2431247bf4 (このIDを非表示/違反報告)
雨の緑茶。(プロフ) - ゆゆゆ。さん» 失礼します。em7様とは関係のない者ですがご回答させていただきます。もう解決されているかなと思いますが、一応https://uranai.nosv.org/u.php/novel/hetadesum4/の「画像のサイズ変更」ページに載っているかと。 (2023年3月17日 14時) (レス) id: 2f0ba08fc2 (このIDを非表示/違反報告)
おはぎ(砂糖・おはぎサブ垢) - 参考にさせていただきました (2022年11月27日 11時) (レス) @page35 id: dfee7c88d4 (このIDを非表示/違反報告)

作品は全て携帯でも見れます
同じような小説を簡単に作れます → 作成
この小説のブログパーツ

作者名:em7 | 作者ホームページ:なし  
作成日時:2020年5月10日 14時

パスワード: (注) 他の人が作った物への荒らし行為は犯罪です。
発覚した場合、即刻通報します。