Question

我有来自第三方来源的布局，我需要在自己的CSS中覆盖。我可以使用常见的css规则来改变样式，如：

#someid-div input[type=checkbox]{
    display:block;
}

和

#someid-container .h1 {
    font-size:20px !important;
}

但现在我有一个不同的情况，我需要环绕或引入其他标签来显示所需的布局。 e.g。

<div class="row" style="margin-bottom: 20px;">
            <div class="form-group col-sm-6">
                <label class="control-label" for="email">Email</label>
                <input name="email" class="form-control" id="email" type="text">
            </div>
 </div>

类似于：

<div class="row" style="margin-bottom: 20px;">
    <div class="form-group col-sm-4">
       <label class="control-label" for="email">Email</label>
    </div>
    <div class="form-group col-sm-6">
        <input name="email" class="form-control" id="email" type="text">
    </div>
</div>

CSS中有可能吗？或者我需要使用jquery吗？一个代码片段将不胜感激。感谢

Answer 1

您可以使用jquery来实现它。这样的事情就可以了。

    $(".row").empty();
    var html = '<div class="form-group col-sm-4"><label class="control-label" for="email">Email</label></div><div class="form-group col-sm-6"><input name="email" class="form-control" id="email" type="text"></div>';
    $(".row").append(html);

在预期的操作成功后插入。

Answer 2

jQuery（未经测试）中的类似内容：

var label = $("label[for='email']");
var parent = label.parent();
$("<div>").setClass("form-group col-sm-4").append(label).insertBefore(parent);

使用您自己的CSS替换css

2 个答案: