ASP.NET 背景剪辑:文字;不工作

ASP.NET Background-clip: text; Not working

我是 .net 核心的新手,想知道我是否做错了什么或遗漏了什么让我的 Background-clip: text; 正常工作,就像在任何其他平台上一样...

我也尝试在多个网络浏览器中调试这个问题,例如 Chrome 和 Microsoft Egde。

我已经尝试了 Background-clip: text;-Webkit-Background-clip: text;,但似乎没有任何效果。它说文本值对 Background-clip

无效

这是我的代码:Style.css

.text-container p {
    -webkit-text-fill-color: transparent;
    font-size: 150px;
    background-image: url("https://s31.postimg.cc/yaze1agjv/abstract-background-canvas-249798.jpg");
    background-repeat: repeat-x;
    background-position: bottom;
    background-size: cover;
    animation: animate 30s linear infinite;
    text-align: center;
    margin-top: 17%;
    text-transform: uppercase;
    font-weight: 900;
    width: 100%;
    height: 100%;
    -webkit-background-clip: text;
    background-clip: text;
}

@keyframes animate {
    0% {
        background-position: left 0px top 10px;
    }

    40% {
        background-position: left 800px top 10px;
    }
}

Index.cshtml

<html class="backimg">
    <body>
        <p class=text-container> Hello World!</p>
    </body>
</html>

*** 编辑:我试图在另一个文本编辑器上调试这个问题,这段代码工作正常。 .NET core 在 background-clip: text; 方面有问题吗? ?在线代码编辑器:JSFiddle ( https://jsfiddle.net/2m6pwvqo/14/ )

你是对的 css 媒体查询的语法,但它不像 Razor 网页中那样...

你可以加个@符号试试下面的

@@keyframes 动画{

}