Material Design Liteでセレクトメニュー(プルダウン)の作成方法
Material Design Liteでformのセレクトメニュー(プルダウン)の作成したかったが、公式ページからセレクトメニューが見つけられなかった。調べたところ作成自体は可能なようなので作成方法及びサンプルをメモ。
サンプル
https://taitan916.info/sample/mdl/select_menu/
作成方法
ソースコード
<div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
<select class="mdl-textfield__input" id="food" name="food">
<option></option>
<option value="カレー">カレー</option>
<option value="寿司">寿司</option>
<option value="ラーメン">ラーメン</option>
<option value="すき焼き">すき焼き</option>
<option value="ハンバーグ">ハンバーグ</option>
</select>
<label class="mdl-textfield__label" for="food">好きな食べ物</label>
</div>
参考サイト
https://stackoverflow.com/questions/31307764/how-to-format-select-box-with-material-design-lite
関連記事
-
-
Flash上にHTMLのテキストやリンク(aタグ)を重ねる方法
FlashにHTMLで文字を書きたかった。そのまま書くのは無理だろうけどCSSか ...
-
-
CSSで1つの要素に複数classを設定して画像を入れ替える方法
メニューリンクで通常時の画像、マウスオーバー時の画像、アクティブ時の画像をそれぞ ...
-
-
LINE風のふきだしデザイン
LINE風のふきだしデザインでページを作ってほしいと言われた。 CSSはあまり理 ...
-
-
要素の表示or非表示
今まで要素の表示or非表示をCSSで操作する際、 display:none; / ...
-
-
CodeIgniter4&Bootstrap&jQueryで簡易版お問い合わせページの作成
CodeIgniter4.4.4&Bootstrap&jQuer ...