Question

我刚刚开始使用SAPUI5，并且在组合框方面遇到了一些麻烦。

当我打开创建的新窗口时，它将开始聚焦组合框，但带有令人讨厌的虚线轮廓。仅当我在组合框之外单击时，它才会消失，但我真的需要它根本不显示，甚至当我单击内部时也不显示。

我尝试了几种库和类，但是这些都没有给我想要的输出。

下面是我尝试过的课程：

.comboCreateDoc {
    border-left: none;
    border-right: none;
    border-top: none;
    outline: 0px transparent !important;
    outline-style: none !important;
}

html.sap-desktop .comboCreateDoc .sapMInputBaseContentWrapper {
    border: none !important;
    background: transparent !important;
    outline-style: none !important;
    outline: 0px dotted transparent !important;
    outline-offset: -3px;
}

html.sap-desktop .sapMBtn:focus > .sapMFocusable {
    outline: 0px dotted transparent !important;
    outline-offset: -3px;
}

html.sap-desktop .sapMCbBgs:active > .sapMFocusable {
    outline: 0px dotted transparent !important;
    outline-offset: -3px;
}

.sapMInputBaseIconContainer{    
    outline: none !important;
}

.sapMComboBoxInner .sapMInputBaseInner{    
    outline: none !important;    
}


html.sap-desktop .sapUiBody:focus {
    outline: non !important;    
}

如何使虚线轮廓消失？

Answer 1

我深入研究了他们的样本以找到组合框，然后发现他们没有使用本机浏览器焦点。他们放置了一个类.sapMFocus，该类为元素提供了虚线边框。

您需要像这样重写类样式：

.sapMFocus .sapMInputBaseContentWrapper::before {
 border:none;
}

不能忽略组合框的轮廓

1 个答案: