用elm-css指定CSS内容属性

Question

使用elm-css，我想在before伪元素

中指定内容属性

我翻译了

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 个参数。

我没有找到 "content" 的正确函数。

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

用elm-css指定CSS内容属性

Specify CSS content property with elm-css

elm