CSS 帮助

小伙伴们对文章编程感兴趣吗？是否正在学习相关知识点？如果是，那么本文《CSS 帮助》，就很适合你，本篇文章讲解的知识点主要包括。在之后的文章中也会多多分享相关知识点，希望对大家的知识积累有所帮助！

我正在尝试将文本附加到棕色框的左侧。我不能。我不知道代码有什么问题。请帮助我。

css

.hero {
    position: relative;
    bottom: 80px;
    display: flex;
    justify-content: left;
    align-items: start;
    color: rgb(255, 255, 255);
    background-color: rgb(80, 40, 40);
    width: 1600px;
    height: 1955px;
    margin: auto;
    border-radius: 60px;
}

.firstheroleft-column {
    font-family: system-ui, -apple-system, blinkmacsystemfont, 'segoe ui', roboto, oxygen, ubuntu, cantarell, 'open sans', 'helvetica neue', sans-serif;
    align-items: start;
    margin-top: 180px;
    margin-left: 40px;
    justify-content: left;
}

.middleheroleft-column {
    font-family: system-ui, -apple-system, blinkmacsystemfont, 'segoe ui', roboto, oxygen, ubuntu, cantarell, 'open sans', 'helvetica neue', sans-serif;
    align-items: start;
    margin-top: 580px;
    margin-left: 40px;
    justify-content: left;
}

.bottleimg {
    width: 80%;
    float: right;
}

.europeimg {
    width: 80%;
}

.trademarkimg {
    width: 80%;
}

html

<section class="hero">
        <div class="firstHeroLeft-column">
            <p>From the moment the water is collected, it undergoes a series of advanced filtration processes to remove any impurities while retaining the essential minerals that contribute to its refreshing taste. The water is then bottled in a state-of-the-art facility, where it is sealed to preserve its natural freshness and purity. We pride ourselves on delivering water that tastes as if it came straight from the source, ensuring every sip is as crisp and revitalizing as the first.</p>
        </div>
        <div class="firstHeroRight-column">
            <img src="./Images/Group 1.svg" alt="", class="bottleImg">
        </div>
        <div class="middleHeroLeft-column">
            <p>We operate in multiple markets, including local, regional, and international distribution channels, ensuring that our water reaches customers in diverse locations. Whether through supermarkets, convenience stores, or direct-to-consumer sales, our products are readily available to meet the needs of both individuals and businesses.</p>
        </div>
        <div class="middleHeroRight-column">
            <img src="./Images/pngtree-blue-europe-map-on-a-white-background-in-flat-png-image_4947413 1.svg" alt="" class="europeImg">
        </div>
        <div class="lastHeroLeft-column">
            <p>Our company is fully registered and operates in compliance with all relevant health and safety regulations. We hold various certifications, including ISO standards, which attest to our dedication to product quality and environmental responsibility. Our bottles are made from eco-friendly materials, and we are continually working to reduce our carbon footprint.</p>
        </div>
        <div class="lastHeroRight-column">
            <img src="./Images/r-registered-trademark-blue-stamp-png-704081694707697q78aqltgsh-removebg-preview 1.svg" alt="" class="trademarkImg">
        </div>
    </section>

以上就是《CSS 帮助》的详细内容，更多关于的资料请关注golang学习网公众号！