gpt4 book ai didi

html - 应用于我网页所有元素的 CSS 过滤器

转载 作者:太空宇宙 更新时间:2023-11-03 23:33:47 25 4
gpt4 key购买 nike

我在我的页面中放置了一个按钮,但我为 html 标记编写的 css 过滤器也应用于我的按钮。我如何避免这种情况?

enter image description here

HTML

<body>
<div class="button">
<a href="#">START EXPERIENCE</a>
</div>
</body>

CSS

html { 
background: url(../img/cover2.jpg) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
-webkit-filter: brightness(0.5);
filter: brightness(0.5);
// Browser Specific
-moz-filter: brightness(0.5);
-o-filter: brightness(0.5);
-ms-filter: brightness(0.5);
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.button {
position: absolute;
left: 40%;
top: 50%;
-webkit-filter: none;
}

.button a {
text-decoration: none;
border: 2px white solid;
color: white;
padding: 25px;
padding-left: 100px;
padding-right: 100px;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 0px;
text-transform: uppercase;
font-weight: bold;
font-size: 22px;
}

.button a:hover {
background: white;
color: black;
color: rgba(0, 0, 0, 0.5);
}

最佳答案

将它应用到 HTML 标记将在您的 HTML 将包含的所有其他内容中全局应用此样式。作为一般经验法则,您应该永远不要明确设置 HTML 标记的样式。这不是它的意图。

应用过滤器的父元素内的任何元素也会受到影响。

关于html - 应用于我网页所有元素的 CSS 过滤器,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24633070/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com