同一页面上的不同表单控件样式 Bootstrap CSS
Varying form-control styles on the same page Bootstrap CSS
有没有办法让表单中的占位符文本在一个部分为白色,在另一个部分为灰色?
HAML:
注册表单 1:
= form_tag splash_signup_path, role: :form, :class=>'form-horizontal', :remote=>true do
.col-sm-12
.input-group
= text_field_tag :signup_email, '', :class=>'form-control', :placeholder=>'Enter your email address to receive the lastest updates'
%span.input-group-btn
= submit_tag 'Submit', :class=>'btn btn-default'
注册表单 2:
= form_tag splash_signup_path, role: :form, :class=>'form-horizontal', :remote=>true do
.col-sm-12
.input-group
= text_field_tag :signup_email, '', :class=>'form-control', :placeholder=>'Enter your email address to receive the lastest updates'
%span.input-group-btn
= submit_tag 'Submit', :class=>'btn btn-default'
CSS:
.form-control::-webkit-input-placeholder { color: white; }
.form-control:-moz-placeholder { color: white; }
.form-control::-moz-placeholder { color: white; }
.form-control:-ms-input-placeholder { color: white; }
.signup {
margin-top: 70px;
margin-bottom: 5px;
position: absolute;
bottom: 20px;
}
.signup-bottom {
top: 20px;
margin-bottom: 20px;
}
编辑:为清楚起见删除了不相关的代码
这行得通吗?
.signup .form-control::-webkit-input-placeholder { color: white; }
.signup .form-control:-moz-placeholder { color: white; }
.signup .form-control::-moz-placeholder { color: white; }
.signup .form-control:-ms-input-placeholder { color: white; }
.signup-bottom .form-control::-webkit-input-placeholder { color: grey; }
.signup-bottom .form-control:-moz-placeholder { color: grey; }
.signup-bottom .form-control::-moz-placeholder { color: grey; }
.signup-bottom .form-control:-ms-input-placeholder { color: grey; }
有没有办法让表单中的占位符文本在一个部分为白色,在另一个部分为灰色?
HAML:
注册表单 1:
= form_tag splash_signup_path, role: :form, :class=>'form-horizontal', :remote=>true do
.col-sm-12
.input-group
= text_field_tag :signup_email, '', :class=>'form-control', :placeholder=>'Enter your email address to receive the lastest updates'
%span.input-group-btn
= submit_tag 'Submit', :class=>'btn btn-default'
注册表单 2:
= form_tag splash_signup_path, role: :form, :class=>'form-horizontal', :remote=>true do
.col-sm-12
.input-group
= text_field_tag :signup_email, '', :class=>'form-control', :placeholder=>'Enter your email address to receive the lastest updates'
%span.input-group-btn
= submit_tag 'Submit', :class=>'btn btn-default'
CSS:
.form-control::-webkit-input-placeholder { color: white; }
.form-control:-moz-placeholder { color: white; }
.form-control::-moz-placeholder { color: white; }
.form-control:-ms-input-placeholder { color: white; }
.signup {
margin-top: 70px;
margin-bottom: 5px;
position: absolute;
bottom: 20px;
}
.signup-bottom {
top: 20px;
margin-bottom: 20px;
}
编辑:为清楚起见删除了不相关的代码
这行得通吗?
.signup .form-control::-webkit-input-placeholder { color: white; }
.signup .form-control:-moz-placeholder { color: white; }
.signup .form-control::-moz-placeholder { color: white; }
.signup .form-control:-ms-input-placeholder { color: white; }
.signup-bottom .form-control::-webkit-input-placeholder { color: grey; }
.signup-bottom .form-control:-moz-placeholder { color: grey; }
.signup-bottom .form-control::-moz-placeholder { color: grey; }
.signup-bottom .form-control:-ms-input-placeholder { color: grey; }