elm - 使用 elm-css 指定 CSS 内容属性

Question

使用 elm-css , 我想在 before 伪元素中指定 content 属性

我翻译了

div.boxclose{
    float:right;
    margin-top:-30px;
    margin-right:-30px;
    cursor:pointer;
    color: #fff;
    border: 1px solid #AEAEAE;
    border-radius: 30px;
    background: #605F61;
    font-size: 31px;
    font-weight: bold;
    display: inline-block;
    line-height: 0px;
    padding: 11px 3px;       
}

.boxclose:before {
    content: "×";
}

与

    div
        [ css
            [ float right
            , marginTop (px -30)
            , marginRight (px -30)
            , cursor pointer
            , color white
            , border3 (px 1) solid darkGrey2
            , borderRadius (px 30)
            , backgroundColor lightGrey
            , fontSize (px 31)
            , fontWeight bold
            , display inlineBlock
            , lineHeight (px 0)
            , padding2 (px 11) (px 3)
            , before [ content "×" ]
            ]
        ]
        []

但它会产生一条错误消息:content 值不是一个函数，但它被赋予了 1 个参数。

我没有找到“内容”的正确功能。

Answer 1

您可以像这样使用 elm-css 的 property 函数:

css [ before [ property "content""'x'"]]

边注:
content 函数用于 flex-basis 属性。在规范中查看更多信息。 https://package.elm-lang.org/packages/rtfeldman/elm-css/latest/Css#content