ASP.NET 背景剪辑：文本；不工作答案

【问题标题】：ASP.NET Background-clip: text; Not workingASP.NET 背景剪辑：文本；不工作
【发布时间】：2022-03-27 18:14:14
【问题描述】：

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

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

我尝试了Background-clip: text; 和-Webkit-Background-clip: text;，但似乎没有任何效果。它说文本值对背景剪辑无效

这是我的代码：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;
    }
}

索引.cshtml

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

*** 编辑：我尝试在另一个文本编辑器上调试此问题，并且此代码运行良好。当涉及到背景剪辑时，.NET 核心是否有问题：文本； ?在线代码编辑器：JSFiddle (https://jsfiddle.net/2m6pwvqo/14/)

【问题讨论】：

标签： c# html css asp.net web-site-project

【解决方案1】：

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

您可以在下面添加额外的@符号并尝试

@@keyframes 动画{

}

【讨论】：