ログイン画面に使うCSSの指定

WordPress

ログイン画面で使うCSSのセレクタです。
よく使うものから、個人的には使わないものまで一通りリストにしました。

ここをカスタマイズすれば、デフォルトからオリジナル感が増すデザインに変更できますね。

コード

/* body */
.login {
}

/* メッセージ */
.login .message,
.login .notice,
.login .success {
}

/* リンク */
.login a {
}

/* ロゴ */
.login h1 a {
}

/* ボックス */
.login form {
}

/* inputのラベル */
.login label {
}

/* input */
.login form .input,
.login input[type="password"],
.login input[type="text"] {
}
/* input:ユーザー名 */
.login .input[type="text"] {
}

/* input:パスワード */
.login .password-input {
}

/* ログイン状態の保存のチェックボックス */
.login input[type="checkbox"] {
}

/* ログイン状態の保存 */
.login .forgetmenot label {
}

/* ボタン */
.login form p.submit {
}
.login .button-primary {
}

/* パスワード再発行のリンク */
.login #nav {
}
.login .wp-login-lost-password {
}

/* サイトへ移動 */
.login #backtoblog {
}

/* プライバシーポリシーのリンク */
.login .privacy-policy-page-link {
}

/* 言語選択 */
.login .language-switcher {
}

この記事の執筆・検証

シゴトノコバコ編集部

Web制作10年以上。コーポレートサイト、大手企業LPなど構築をメインに実務経験あり。デザイン/印刷の実務経験も多少あり