18910140161

如何改变父级不透明而不影响一个子级?

顺晟科技

2021-08-17 10:53:38

30

我有一个divhas类slider__slide。我想将它的不透明度设置为零,但条件是它隐藏所有子元素,除了具有类rh08w2 rh02txt的元素。当父div不透明度设置为0时,是否可以不隐藏子div。

以下是我的代码

<!DOCTYPE html>
<html lang="en-US" class="no-js">
<head>


    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <style>
        .rw-neutral-50bg {
            background-color: #D4CFCA;
        }
        .rh08 .slider__slide .rh08w2 {
            display: flex;
        }
        @media only screen and (min-width: 1081px) {
            .rh08 .rh08w1 {
                display: grid;
                grid-template-columns: repeat(10, [col-start] 1fr);
                grid-template-rows: repeat(8, [row-start] 1fr);
            }
        }
        @media only screen and (min-width: 1081px) {
            .rh08 .rh02txt {
                grid-column: col-start 6 / span 6;
                grid-row: row-start 2 / span 6;
                background: #fff;
                min-height: 604px;
                padding: 3em;
            }
        }

        .slider__slide {
            opacity:1
        }
    </style>
</head>
<body class="f20 f20v0" >
<div class="f20w1">

    <section class="rh08 rh08v0 rw-neutral-50bg" data-trackas="rh08" data-ocomid="rh08">
        <div id="slider1" class="slider">
            <div class="slider__track">
                <div class="slider__list">
                    <div class="slider__slide">
                        <div style="background:red">hhhhh</div>
                        <div class="rh08w1 cpad">
                            <div class="rh08w2 rh02txt">
                                <div class="rh08w5">
                                    <div class="rh08w6">
                                        <h2 class="rwaccent-4">[Slide -1]cc Premier League wä
                                            für neue,
                                            fortschrittliche Fußballanalysen</h2>
                                        <p>cc Das Gesundheitsmanagementsystem des australischen Bundesstaates
                                            digitalisiert
                                            die
                                            Patientenaufnahme und verwaltet gleichzeitig Gesundheitsakten und
                                            Impfstoffbestände
                                            sicher.</p>
                                        <div class="obttns">
                                            <div class="obttn">
                                                <a href="placeholder.html">Get the details</a>
                                            </div>
                                            <div class="obttn1">
                                                <a href="placeholder.html">Learn more</a>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

    </section>
   


</div>
</body>
</html>

当我使用下面的css时。它隐藏我的div,它有类rh08w2 rh02txt

.slider__slide {
                opacity:0
            }

顺晟科技:

  • TAG:
相关文章
我们已经准备好了,你呢?
2024我们与您携手共赢,为您的企业形象保驾护航