Question

我正在使用js在c＃中创建一个Web应用程序，其中我正在使用Telerik组件，

问题是我的telerik下拉菜单的自定义类是

.RadComboBox_Bootstrap {
    font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
}

现在我要删除该类，我做了如下类似的事情

$('.RadComboBox_Bootstrap').css({'font-family':''})

还有

$('.RadComboBox_Bootstrap').css({'font-family':'Arial !important'})

但对我没有任何帮助

我尝试了以下

$('.RadComboBox_Bootstrap').eq(13).css({'font-size':'8px'})

并且radcombobox的字体大小已更改，但是当我尝试更改字体系列时，我无法成功，这可能是什么问题？

Answer 1

我有一个问题：您说过要删除该类，但随后您尝试覆盖css规则...要归档什么？

如果要删除该类，则应使用removeClass方法。参见文档here;

如果您想覆盖css规则：是否可能

$('.RadComboBox_Bootstrap').css({'font-family':''})

是在.RadComboBox_Bootstrap元素被渲染/修饰之前执行的吗？（是document.ready（或$('.RadComboBox_Bootstrap').css({'font-family':''})中的$(function(){...})函数）吗？）。如果在加载dom之前执行了该指令，则jQuery选择器将找不到任何元素，并且不应用css规则。在此示例中，该规则将不应用

<html>
    <head>
        <!-- import jquery here -->
        <script>
           $('.RadComboBox_Bootstrap').css({'font-family':''})
        </script>
    </head>
    <body>
        <div class="RadComboBox_Bootstrap"></div>
    </body>
</html>

在此示例中，它将

<html>
    <head>
        <!-- import jquery here -->
        <script>
            $(function(){
                $('.RadComboBox_Bootstrap').css({'font-family':''});
            });
        </script>
    </head>
    <body>
        <div class="RadComboBox_Bootstrap"></div>
    </body>
</html>

无论如何，您始终可以编写自己的CSS规则来覆盖您所报告的规则：

.my-wrapper .RadComboBox_Bootstrap {
    font-family: Arial,sans-serif;
}

（您必须将my-wrapper类添加到父级）。这样，您的自定义规则将对dom元素“更具体”，并将被应用。有关详细信息，请参见this

Answer 2

如果要禁用嵌入式外观，可以将EnableEmbeddedSkins属性设置为false，或者如果您只想覆盖多个规则，最好创建自己的类，将其添加到ComboBox中使用CssClass属性。在CSS文件中，为您的类选择一个强大的选择器并覆盖规则。 Telerik控件高度依赖于自己的类，如果删除它们，可能会导致外观异常。

<telerik:RadComboBox ID="RadComboBox1" runat="server" EnableEmbeddedSkins="false" CssClass="myClass">
</telerik:RadComboBox>

请参阅Specificity和CSS Specificity: Things You Should Know，以更好地了解CSS类选择器以及如何使其更强大。

更新：

使用纯CSS可以更改字体。您只需关注上面提到的CSS特异性。

重要的是，Telerik RadComboBox由两个单独的HTML元素组成。 RadComboBox元素和RadComboBoxDropDown元素。其中一个项目，即选定的项目属于RadComboBox元素，而在下拉菜单打开时显示的其余项目，则属于RadComboBoxDropDown元素。

更改RadComboBox元素的字体，只会更改所选项目。另外，还需要为RadComboBoxDropDown中的项目应用其他样式。

示例CSS：

html body .RadComboBox_Bootstrap, /** font for RadComboBox */
html body .RadComboBoxDropDown_Bootstrap { /** font for RadComboBoxDropDown */
    font-family: cursive;
}

从jquery的telerik radcombobox删除字体家族

2 个答案: