28CSS選択ボックス

無料のHTMLおよびCSSカスタム選択ボックスのコード例のコレクション:ドロップダウン、複数、カスタム矢印など。2018年6月のコレクションの更新。 4つの新しいアイテム。

  1. jQuery選択ボックス
  2. ブートストラップマルチ選択ボックス

作成者

  • FrankieDoodie
  • 2018年10月30日

リンク

  • デモとコード

作成

  • HTML / CSS

コードについて

カスタム選択ボックス

カスタム選択ボックスのドロップダウンスタイル。

互換性のあるブラウザ:Chrome、Edge、Firefox、Opera、Safari

応答:はい

依存関係:font-awesome.css

作成者

  • ヒマラヤの歌
  • 2018年10月20日

リンク

  • デモとコード
  • ドリブルショット

作成

  • HTML / CSS

コードについて

方向認識ホバー効果のある純粋なCSS選択ボックス

純粋なCSS選択JavaScriptのないボックス。オプションにホバーがある場合、オプション内のアイコンの動きは、ホバーの方向、つまり上ホバーまたは下ホバー(方向認識ホバー効果)によって決定されます。

互換性のあるブラウザー:Chrome、Edge、Firefox、Opera 、Safari

応答:はい

依存関係:font-awesome.css

作成者

  • ベニアミン
  • 2017年8月11日

リンク

  • デモとコード

作成

  • HTML(Pug)/ CSS(SCSS)

コードについて

純粋なCSS選択ボックス

JavaScriptとネイティブ要素を使用しない選択ボックス。

互換性のあるブラウザー:Chrome 、Edge、Firefox、Opera、Safari

応答:はい

依存関係:-

作成者

  • DejanBabić
  • 12月15日2017

リンク

  • デモとコード

作成

  • HTML
  • CSS / SCSS
  • JavaScript(jQuery.js)

コードについて

レスポンシブカスタム選択ボックス

カスタムスクロール付きのレスポンシブカスタム選択ボックス。

作成者

  • ルイスロビンソン
  • 2017年11月27日

リンク

  • デモとコード

作成

  • HTML
  • CSS / SCSS
  • JavaScript(jQuery.js )

コードについて

画像の選択

フェイクロードを使用した画像の選択。

作成者

  • luisdanielroviracontreras
  • 2017年11月27日

リンク

  • デモとコード

作成

  • HTML
  • CSS(資料ize.css)
  • JavaScript(jQuery.js、materialize.js)

コードについて

マテリアライズ選択

JSスタイル選択をマテリアライズします。

作成者

  • マテウスの販売
  • 2017年11月15日

リンク

  • デモとコード

作成

  • HTML / Slim
  • CSS / Sass

コードについて

カスタム選択ラッパー

カスタムCSS選択ラッパー。

デモ画像:カスタム選択

カスタム選択

HTML、CSS、jQueryのカスタム選択。
AlessandroFalchi製
2017年4月5日

デモ画像:カスタムオプションを選択

Optioをカスタム選択n

カスタム選択。ブラウザでの選択の一般的なスタイルを変更するように設計されています。JSを使用してクリックするとリストが表示され、SCSSを使用してスタイルを指定します。選択した属性は正常に機能します。テストしてください。
DanySantos製
2017年2月8日

デモ画像:マテリアルデザイン選択ドロップダウン

マテリアルデザイン選択ドロップダウン

HTML、CSS、およびマテリアルデザイン選択ドロップダウンJavaScript。
SamMurphey製
2017年1月20日

デモ画像:オプションの相互作用を選択

オプションの相互作用を選択

クリーンなアニメーションの優れた例。 TweenMaxGSAPで構築されています。
Bhakti AlAkbar製
2016年12月7日

デモ画像:選択ボックス

選択ボックス

HTML、CSS、JSを使用した選択ボックス。
NipunParadkar製
10月2016年22月22日

デモ画像:CSSスタイルとフィルター可能な選択ドロップダウン

CSSスタイルとフィルター可能な選択ドロップダウン

選択ドロップダウン-HTML、CSS、バニラJSを使用してスタイルとフィルター可能。入力フィールドを使用してドロップダウンリストから値を取得します。
MariJohannessen製
2016年10月13日

デモ画像:CSSのみ選択

CSSのみ選択

CSSのみ選択(ラジオ+チェックボックス)。
Aoyue製
2016年8月24日

デモ画像:プレースホルダー付きのボックスを選択

プレースホルダー付きのボックスを選択

プレースホルダー付きのHTMLおよびCSS選択ボックス。
JamesNowland製
2016年5月16日

デモ画像:CSSのみ選択

CSSのみ選択

無線入力を使用して入力を選択します。
NicolasUdy製
2016年5月9日

デモ画像:純粋なCSS選択

純粋なCSS選択

入力を選択し、CSSのみ。
RaúlBarrera製
2016年4月8日

デモ画像:PrettySelectドロップダウン

PrettySelectドロップダウン

これでも入力を使用して、主にCSSに依存しながら、フォーム送信変数を維持します。
Made by j0be
2016年1月15日

デモ画像:カスタム選択ボックス

カスタム選択ボックス

jQueryを使用したカスタム選択ボックス。
Vijaya KumarVulchi製
2016年1月7日

デモ画像:資料デザインセレクト

マテリアルデザインセレクト

マテリアルデザインセレクトjQueryバージョン。
LukyVJ製
2016年1月3日

デモ画像:Horizonta l選択

水平選択

単純な水平選択。
Bharani製
2015年11月23日

作成者

  • アレックス
  • 2015年10月5日

リンク

  • デモとコード
  • チュートリアル

作成

  • HTML / CSS

コードについて

CSSを使用した選択ボックスのスタイリング

CSSだけで選択ドロップダウンのスタイルを設定するクリエイティブな方法。

互換性のあるブラウザ:Chrome、Edge、Firefox、Opera、Safari

応答性:はい

依存関係:-

デモ画像:カスタム選択

カスタム選択

選択入力をカスタマイズする簡単な方法。
ChristopheCORBALAN製
2015年9月10日

デモ画像:メニューを選択

メニューの選択

HTML、CSS、JavaScriptを使用したメニューの選択。
作成者:Pierre Laurent
2015年6月23日

デモ画像:カスタム選択

カスタム選択

非常に基本的なカスタム選択です。
Yusuf製
2015年5月1日

デモ画像:カスタム選択

カスタム選択

アニメーションによるカスタム選択。
作成者:Nikolay Talanov
2014年9月5日

デモ画像:セレクション

セレクショナー

マルチセレクトウィジェットの概念の証明。
ベンジャミン製
2014年5月23日

デモ画像:CSS3カードデッキのドロップダウン

CSS3 C ardデッキのドロップダウン

HTML、CSS、JSカードのデッキのドロップダウン。
TiborKatelbach製
2013年7月23日

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です