0

非常快速和基本的问题，但我似乎无法在网上找到答案。

在 CSS 中，是否可以完全根据表单的形式来设置“提交”的样式？此外，是否有任何理由不这样做，而是使用特定名称，例如 #subbit_search_form

4

4 回答 4

3

当然是。假设您的表单的 id 为MyForm，您的 CSS 将如下所示：

#MyForm button
{
}

这是一个工作示例

button这将使用带有 id 的表单设置所有元素的样式MyForm。

于 2013-05-22T10:07:00.747 回答
2

取决于你必须设计什么钩子......给表格一个id然后......

<form id="certain-form" >
    ...
    <button type="submit">Your Button</button>
</form>

的CSS：

#certain-form button { ..your unique styles.. }
于 2013-05-22T10:07:23.293 回答
1

对的，这是可能的。这是解决方案。

的HTML：

<form>
    <label>
        <input type="button" value="Button" class="button"></input>
    </label>
</form>

或者

<form>
    <label>
        <input type="submit" value="Button" class="button"></input>
    </label>
</form>

CSS：

.button
{
    border-top:     2px solid #a3ceda;
    border-left:        2px solid #a3ceda;
    border-right:       2px solid #4f6267;
    border-bottom:      2px solid #4f6267;
    padding:        10px 20px !important;
    font-size:      14px !important;
    background-color:   #c4f1fe;
    font-weight:        bold;
    color:          #2d525d;
}

希望这可以帮助。

编辑

如果您想使用特定属性进行定位。这是解决方案。

CSS 变化

input[type="submit"]
{
    border-top:     2px solid #a3ceda;
    border-left:        2px solid #a3ceda;
    border-right:       2px solid #4f6267;
    border-bottom:      2px solid #4f6267;
    padding:        10px 20px !important;
    font-size:      14px !important;
    background-color:   #c4f1fe;
    font-weight:        bold;
    color:          #2d525d;
}

或者，这也可以使用。

于 2013-05-22T10:09:37.657 回答
0

我只是想分享，虽然你的问题已经解决了..

如果您想添加样式submit而不是使用特定的表单名称#subit_search_form，您可以使用 jquery 选择器formwithname和inputwithtype来添加 css 样式。

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$("form[name=subit_search_form] input[type=submit]").css({
    "background-color": "#FE9900",
    "font-weight": "bold",
    "font-family": "Arial,Helvetica,sans-serif",
    "border": "1px solid #000066",
    "cursor": "pointer"
});
</script>

<form name="subit_search_form">
<input type="submit" name="submit" id="submit" value="Search" />
</form>

jsffile

但我更喜欢@musefan 的解决方案，使用button

于 2013-05-22T10:41:35.073 回答