如何增加外部 css 相对于内部 css 的特异性?

问题描述 投票:0回答:1

如何增加外部(fcomponents.css)的特异性。在该CSS中有数千个代码需要更改,这将花费大量时间。是否有其他方法可以在不影响内部 body css 的情况下解决问题?

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
       body {
    display: block !important;
    overflow: hidden;
    margin: 0;
    padding: 0;
    font-family: var(--fw-regular);
    font-size: 1.4rem;
    text-align: center;
    background-color: #fff !important;
    line-height: 18px;
    text-rendering: optimizeLegibility;
}

   .body button{
    font-size: 18px;
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: 2px;
    color: yellow !important;
    background-color: #02010100;
    border-style: solid;
    border-width: 2px;
    border-color: aqua;
    border-radius: 0 0 0 0;
    padding: 18px 35px 13px;
        }

        
        
    .body button:hover{
        color: #fff;
    background-color: #99a66d;
    border-style: solid;
    border-width: 2px;
    border-color: #99a66d;
        }
    </style>
        <link rel="stylesheet" href="styles/fcomponents.css">
    
</head>
<body class="body">
    <button onclick="()">Click ME!</button>
 

</body>
</html>

html css css-selectors
1个回答
0
投票

如果我理解正确的话,您希望在 external CSS 中具有更高的特异性,以便它覆盖您的内部 CSS?由于您无法访问和编辑外部 CSS,因此您唯一的选择就是重构内部 CSS。

© www.soinside.com 2019 - 2024. All rights reserved.