0

I'm implementing a Kendo PanelBar on my webpage. I'm pretty new to CSS/HTML, so I'm lost on how to remove a default style on the PanelBar. When I select a panel, it opens properly and looks fine. When I move the mouse away from the open panel, there is an orange border that appears on the open panel. I have attached two images showing the issue.

Everything looks fine when I hover on the open panel:

When I move the mouse away, there is an orange border:

Can anyone tell me how to remove this border?

4

3 回答 3

2

我遇到了同样的问题,并向剑道支持提交了一张票。Iliana Nikolova 提供了以下内容:

.k-panelbar .k-state-focused.k-state-selected {
    box-shadow: none;
}

在我的解决方案中,panelBar 框阴影仍在显示,然后我使用页面检查器 (F12) 并使用 box-shadow:none; 测试以下规则;财产,这对我有用。

.k-state-selected > .k-link, .k-panelbar > li > .k-state-selected, .k-panelbar > li.k-state-default > .k-state-selected.k-link {
            background-color: #C7D3A9;
            color:black;
            box-shadow: none;
}

在你的帖子之前,我正在搜索一大堆代码,但没有找到任何位置。我使用了使用主题生成器的建议并拍摄了一段视频(使用 windows media encoder 9),我觉得通过说明问题有助于产生更好的剑道反应。Iliana 没有返回我的修复代码,所以这让我挂了,但他确实提供了关键元素。

如果您发现这解决了问题,请投票回答。其他也觉得这很有帮助的人也请提供积极的反馈。

于 2014-08-13T16:36:23.880 回答
1

我不确定它是什么元素,因为您没有给出确切的代码。

但是您可以使用简单的 css,找到元素并应用 css 来删除橙色边框。

于 2014-06-19T04:28:42.323 回答
1

我遇到过同样的问题。在http://demos.telerik.com/kendo-ui/themebuilder/使用剑道主题生成器,然后加载默认主题。您应该会看到主题构建器面板出现在屏幕的右下角。查找“小部件状态”下拉菜单。您将在那里看到选项,您可以更改橙色边框颜色。

现在,如果您想完全移除橙色边框和活动状态,您需要打开 kendo.default.min.css 文件并对十六进制颜色代码 #f35800 执行 CNTRL+F(查找)。仔细查看选择器以确保您正在修改正确的样式(即 .k-state-selected)

然后当你确定你有正确的选择器时,将颜色更改为“透明”(即边框颜色:透明)

这对我有用

于 2014-07-07T09:05:29.140 回答