jquery - 用你自己的 css 覆盖 css

Question

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

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

和

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

但现在我遇到了不同的情况，我需要环绕或引入额外的标签来显示所需的布局。例如

<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);

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