单击按钮时如何消除按钮周围的蓝色阴影?

我正在使用Elm和mdgriffith/elmui构建Web应用程序。

单击前按钮的图片:

accessibility - 单击按钮时出现蓝色阴影-LMLPHP

然后单击:

accessibility - 单击按钮时出现蓝色阴影-LMLPHP

榆木代码:

module Main exposing (main)

import Browser
import Element as E
import Element.Input as Ei
import Element.Border as Eb

main = E.layout [ E.padding 30 ] <|
    Ei.button []
        { onPress = Nothing
        , label = E.text "A button"
        }


run it in Ellie

如果可能的话,我不想使用任何CSS。

编辑:

我不认为这是重复的,因为我的问题是关于如何使用elm-ui而不是CSS来做到这一点。

最佳答案

我要使用的解决方案是使用一些CSS,因为我找不到在elm-ui中做到这一点的方法。这有效:

module Main exposing (main)

import Html.Attributes as Hat
import Element as E
import Element.Input as Ei

noOutline = E.htmlAttribute <| Hat.style "box-shadow" "none"

main = E.layout [ E.padding 30 ] <|
    Ei.button [ noOutline ]
        { onPress = Nothing
        , label = E.text "A button"
        }


(感谢glennsl的评论。)

10-07 12:07
查看更多