遇到问题将CSS应用到表单

你好我想申请CSS这种形式：遇到问题将CSS应用到表单

<form action="http://billerica.mvlc.org/opac/en-US/skin/default/xml/rresult.xml" accept-charset="UTF-8" method="get"> 
      <div id="search-box"> 
       Catalog Search:<br /> 
       <input type="hidden" id="rt" name="rt" value="keyword" /> 
       <input type="hidden" id="tp" name="tp" value="keyword" /> 
       <input type="text" alt="Input Box for Catalog Search" maxlength="250" 
       size="20" id="t" name="t" value="" /> 
       <input type="hidden" id="ft" name="ft" value="" /> 
       <input type="hidden" id="l" name="l" value="9" /> 
       <input type="hidden" id="d" name="d" value="2" /> 
       <input type="hidden" id="f" name="f" value="" /> 
       <input type="hidden" id="av" name="av" value="" /> 
       <input type="submit" value="Search" class="form-submit" /> 
      </div> 
      </form>

我想样式的搜索按钮，并输入字段。我已经看过整个谷歌搜索结果和这个网站，发现遍地使用此格式样式按钮：

.submit input { 
    color  : #000; 
    background : #ffa20f; 
    border  : 2px outset #d7b9c9; 
}

但这不影响我的搜索按钮都没有。我如何正确引用该按钮？

来源

2012-06-04 Sam

您的搜索按钮有一个“表单提交”类，而您的CSS规则正在寻找一类“提交”。如果你改变你的CSS规则下面，应针对正确的元素：

.form-submit 
{ 
    color: #000; 
    background: #ffa20f; 
    border: 2px outset #d7b9c9; 
}

来源

2012-06-04 19:25:25

不错，打我一分钟。我需要独自离开jsfiddle lol – Hacknightly

有趣的是，我想你的答案是更好的，因为你包括了这个工作的例子。 –

谢谢，工作就像一个魅力！ – Sam

看来你是不正确的目标输入。尝试使用以下CSS为父元素的ID，然后提交按钮。

#search-box .form-submit { 
    color: #000; 
    background: #ffa20f; 
    border: 2px outset #d7b9c9; 
}

http://jsfiddle.net/WcVdn/

来源

2012-06-04 19:25:50 Hacknightly

其实你正在尝试做的是造型的容器内的输入标签带班提交。如果你想风格输入类型提交。

input[type="submit"]{ 
    color: #000; 
    background: #ffa20f; 
    border: 2px outset #d7b9c9; 

}

来源

2012-06-04 19:26:38 SVS

遇到问题将CSS应用到表单

回答

相关问题