スキルアップを始める!

【CSS】input name属性をCSSで指定する方法

この記事は約1分で読めます。

※記事中に広告情報を含みます。

\ワードプレスのスキルアップはこちら!/ WordPress入門読本

フォームなどでクラス名を持っておらず、nameやvalueでCSSを指定したいと思った時に、inputのname属性をcssセレクタとして指定する方法です

input[name=”値”]

ということで「input[name=”値”]」と指定をすることで、CSSを適用させることができます。

input[name="abcdefg"]{
}

input typeで指定する場合

input typeで指定する場合は、下記のような方法で指定可能です。

input[type="text"] ,input[type="email"]  {
  color: #eee;
}

valueの場合

valueの場合は、まずvalueの値を渡してあげて、分ける必要があります。

input[value="1234567"] {
  color: #eee;
}

nameとvalueを両方適用させる

nameとvalueを両方適用させることも可能でした。

input[name="name", value="val1234"] {
  color: #eee;
}

まとめ

input[name=”値”]でname属性の値を取得することができます。

ご参考ください😃

URLをコピーしました!