从 Telerik 控件中删除默认内联样式

发布于 2024-12-13 08:41:45 字数 293 浏览 2 评论 0原文

使用 Telerik 控件时，如果我没有指定文本框的宽度，Telerik 将添加内联属性

style="width: 125px"

有没有办法阻止 Telerik 添加这样的默认值？

（注意：这不是从 telerik 控件中删除所有 CSS 的默认设置，询问如何删除默认样式表而不是内联样式）

原文

When using Telerik controls if e.g. I don't specify a width for a textbox, telerik adds the inline attribute

style="width: 125px"

Is there a way to stop telerik adding default values like this?

(NOTE: This isn't a default of Removing all CSS from telerik controls, which is asking how to remove default stylesheets rather than inline styles)

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

时光沙漏 2024-12-20 08:41:45

以下是 Telerik 的一些解决方案：

如何删除 RadInput 文本框的默认宽度或使用外部 CSS 设置它

回复收藏 0 原文

情归归情 2024-12-20 08:41:45

我不确定，但您可以尝试搜索样式表以查找输入的默认宽度规范。除此之外，您也许可以覆盖该属性并使用 !important 设置宽度。

<telerik:RadTextBox ID="RadTextBox1" runat="server" style="width:200px !important;" ... >

编辑

尝试将这样的样式添加到您的页面或样式表中。这可能不是 100%，但应该很接近：

.RadInput .RadInput_Sunset { /* replace "_Sunset" with whatever skin you're using */
    width: auto; 
}

编辑

如果您只需要设置一个控件的样式，请尝试以下操作：

#ClientID_OF_INPUT { 
    width: auto !important;
}

I'm not sure, but you could try searching through the stylesheet(s) to find a default width specification for inputs. aside from that, you might be able to override the attribute and set the width using !important.

<telerik:RadTextBox ID="RadTextBox1" runat="server" style="width:200px !important;" ... >

EDIT

Try adding a style like this to your page or stylesheet. This might not be 100%, but it should be close:

.RadInput .RadInput_Sunset { /* replace "_Sunset" with whatever skin you're using */
    width: auto; 
}

EDIT

If you only need to style one control, try this:

#ClientID_OF_INPUT { 
    width: auto !important;
}

回复收藏 0 原文

疾风者 2024-12-20 08:41:45

这是我的最终实现，适用于 RadInput 和 RadComboBox。该功能需要适应每个控件，因为 Telerik 将样式放在不同的位置。

function removeWidths (sender) {
    //remove only the width style from the inline style collection
    sender._originalTextBoxCssText && (sender._originalTextBoxCssText = sender._originalTextBoxCssText.replace(/(^|[^-])width\s?:\s?[\w|\.]+\s?;/i, "$1"));
    sender.updateCssClass && sender.updateCssClass();
    if(sender.constructor.__typeName == "Telerik.Web.UI.RadComboBox") {
        $(sender._inputDomElement).closest(".RadComboBox").removeAttr("style");
    }
},

Here's a my eventual implementation, which works for RadInput and RadComboBox. The function needs adapting for each control as telerik put styles in varying places.

function removeWidths (sender) {
    //remove only the width style from the inline style collection
    sender._originalTextBoxCssText && (sender._originalTextBoxCssText = sender._originalTextBoxCssText.replace(/(^|[^-])width\s?:\s?[\w|\.]+\s?;/i, "$1"));
    sender.updateCssClass && sender.updateCssClass();
    if(sender.constructor.__typeName == "Telerik.Web.UI.RadComboBox") {
        $(sender._inputDomElement).closest(".RadComboBox").removeAttr("style");
    }
},

回复收藏 0 原文

酒浓于脸红 2024-12-20 08:41:45

遇到了同样的问题，而且我不是 !important 覆盖或 JavaScript 解决方案的特别粉丝。

深入研究RadInputControl，我可以看到Unit.Pixel(160)是默认的Width，但前提是RenderMode控件的宽度不是 Lightweight，因此切换到 Lightweight 会删除显式内联宽度，否则，如果这不是 RadTextbox 的选项，我发现如果您设置 Columns 属性0 它只输出

style="width:;"

This isn't看上去有效对我来说，所以我猜测大多数浏览器会忽略这一点，但我自己还没有广泛测试它。

Had the same issue and I'm not a particular fan of !important overrides or JavaScript solutions.

Digging into RadInputControl I could see that Unit.Pixel(160) is the default Width but only if the RenderMode of the control is not Lightweight, so switching to Lightweight removes the explicit inline width, otherwise if that's not an option for the RadTextbox I found that if you set the Columns property to 0 it only outputs