没有出现在文本输入上的CSS属性

-1

我试图让一些CSS属性出现在我的窗体中，但是当我将属性移动到父html元素时，它不起作用。的CSS属性直接应用于.input类的工作，但是当应用于父.form-control类，他们不工作，似乎并没有影响到.form-control性的输入和没有出现在Chrome浏览器开发工具，如果我检查文本输入元素？没有出现在文本输入上的CSS属性

.form-control { 
 
    display: inline-block; 
 
    height: 34px; 
 
    width: 100%; 
 
    margin: 10px; 
 
    border-radius: 4px; 
 
    border: 1px solid #ccc; 
 
} 
 

 

 
/*.form-control .input {*/ 
 
/*height: 34px;*/ 
 
/*width: 100%;*/ 
 
/*margin: 10px;*/ 
 
/*border-radius: 4px;*/ 
 
/*border: 1px solid #ccc;*/ 
 
/*}*/ 
 

 
.form-control .button { 
 
    display: block; 
 
    background-color: limegreen; 
 
    font-size: 14px; 
 
    font-weight: 400; 
 
    color: white; 
 
    margin: auto; 
 
    vertical-align: middle; 
 
    padding: 6px 12px; 
 
    border: 1px solid transparent; 
 
    height: 25px; 
 
    border-radius: 4px; 
 
}

<form className="form-control"> 
 
    <input className="input" type="text" /> 
 
    <button className="button">Get Weather</button> 
 
</form>

来源

2017-05-30 Yunti

why className =“”and not class =“”？ –

很可能是因为OP采用阵营：https://facebook.github.io/react/docs/dom-elements.html – Terry

是抱歉，我应该怎么用阵营增加了。 – Yunti

从代码片断你提供的，那是因为你是直接应用规则的形式，而不是形式的输入。输入不会继承您在窗体上设置的属性。您需要特别针对输入，就像您在注释掉的代码中一样。

来源

2017-05-30 14:43:30

没有出现在文本输入上的CSS属性

回答

相关问题