Question

我的网站上有3个表单，我想为其占位符设置样式。我希望网站上的所有其他输入保持自己的样式。在我看来，我设法对一种形式的输入进行了样式，但是如何为所有3种形式分组样式

＆＃13;

.one-form input::-webkit-input-placeholder { color: #d6d6d6; }
.one-form input:-moz-placeholder { /* Firefox 18- */ color: #d6d6d6; }
.one-form input::-moz-placeholder {  /* Firefox 19+ */ color: #d6d6d6; }
.one-form input:-ms-input-placeholder {   color: #d6d6d6; }

＆＃13;

<form class="one-form" action="" method="post">
  <input type="text" name="log" placeholder="Username"/>
  <input type="password" name="pwd" placeholder="Password" />
  <input type="submit" name="1-submit" id="1-submit" value="Start" /> 	
</form>

<form class="three-form" action="" method="post">
  <input type="text" name="smthing" placeholder="Username"/>
  <input type="password" name="someth" placeholder="Password" />
  <input type="submit" name="1-submit" id="1-submit" value="Start" /> 	
</form>

<form class="two-form" action="" method="post">
  <input type="text" name="smth" placeholder="Username"/>
  <input type="password" name="some" placeholder="Password" />
  <input type="submit" name="1-submit" id="1-submit" value="Start" /> 	
</form>

＆＃13;

我在问，因为我读到了somwhere，如果你将css分组，它将被完全忽略

Answer 1

在所有三种形式中添加一个公共类并设置样式。

＆＃13;

<form class="one-form custom-form" action="" method="post">
  <input type="text" name="log" placeholder="Username"/>
  <input type="password" name="pwd" placeholder="Password" />
  <input type="submit" name="1-submit" id="1-submit" value="Start" /> 	
</form>

<form class="three-form custom-form" action="" method="post">
  <input type="text" name="smthing" placeholder="Username"/>
  <input type="password" name="someth" placeholder="Password" />
  <input type="submit" name="1-submit" id="1-submit" value="Start" /> 	
</form>

<form class="two-form custom-form" action="" method="post">
  <input type="text" name="smth" placeholder="Username"/>
  <input type="password" name="some" placeholder="Password" />
  <input type="submit" name="1-submit" id="1-submit" value="Start" /> 	
</form>

＆＃13;

DateTime dTime = DateTime.Parse(/*String from sql database*/);
                                  // German weekday abbreviations
String[] Days = new string[] { "Mo", "Di", "Mi", "Do", "Fr", "Sa", "So" };

string Day = dTime.ToString("ddd", new CultureInfo("de-DE"));
string DayFrom = "Di";
string DayTill = "Mi";

int DayposStop = Array.IndexOf(Days, Day);
int DayposFrom = Array.IndexOf(Days, DayFrom);
int DayposTill = Array.IndexOf(Days, DayTill);

if (((DayposFrom <= Daypos || Daypos <= DayposTill)

＆＃13;

Answer 2

将所需的样式赋予所有表单之间的公共类。（例如.one-form）

.one-form input::-webkit-input-placeholder { color: #d6d6d6; }
.one-form input:-moz-placeholder { /* Firefox 18- */ color: #d6d6d6; }
.one-form input::-moz-placeholder {  /* Firefox 19+ */ color: #d6d6d6; }
.one-form input:-ms-input-placeholder {   color: #d6d6d6; }

<form class="one-form" action="" method="post">
  <input type="text" name="log" placeholder="Username"/>
  <input type="password" name="pwd" placeholder="Password" />
  <input type="submit" name="1-submit" id="1-submit" value="Start" /> 	
</form>

<form class="three-form one-form" action="" method="post">
  <input type="text" name="smthing" placeholder="Username"/>
  <input type="password" name="someth" placeholder="Password" />
  <input type="submit" name="1-submit" id="1-submit" value="Start" /> 	
</form>

<form class="two-form one-form" action="" method="post">
  <input type="text" name="smth" placeholder="Username"/>
  <input type="password" name="some" placeholder="Password" />
  <input type="submit" name="1-submit" id="1-submit" value="Start" /> 	
</form>

Answer 3

在规则中添加多个选择器：

res.json

Answer 4

我不知道我是否正确了，但你可以这样做

.one-form input::-webkit-input-placeholder,
.two-form input::-webkit-input-placeholder,
.three-form input::-webkit-input-placeholder{ color: #d6d6d6; }

.one-form input:-moz-placeholder,
.two-form input:-moz-placeholder,
.three-form input:-moz-placeholder{ /* Firefox 18- */ color: #d6d6d6; }

.one-form input::-moz-placeholder,
.two-form input::-moz-placeholder,
.three-form input::-moz-placeholder{  /* Firefox 19+ */ color: #d6d6d6; }

.one-form input:-ms-input-placeholder,
.two-form input:-ms-input-placeholder,
.three-form input:-ms-input-placeholder{   color: #d6d6d6; }

JSfiddle：https://jsfiddle.net/ts57n0np/

样式输入占位符

4 个答案: