Webprofis is een Forum waarin je vragen kunt stellen die webgerelateerd zijn. Heb je vragen over of problemen met je Webpagina, HTML, CSS, Javascript, PHP of andere client of serverside scriptingtalen? Stel ze dan gerust op dit forum. Op dit forum zijn een aantal vrijwilligers actief die u graag met uw vragen willen helpen en u waar mogelijk een passend antwoord aanbieden. Hebt u zelf veel ervaring en kennis met betrekking tot het bovenstaande? U bent van harte welkom om uw kennis met anderen te delen!

We hopen dat eenieder op dit Forum een leerzame ervaring mag opdoen.

Team Webprofis

Opgelost text helder in div als background lage opacity heeft

bewerkt wo 27 jan 2016 in Stylesheets Posts: 879
Ik loop tegen het volgende probleem aan:
Een footer waarin een gradient zit en waarop een lage opacity staat. Binnen die footer moet een copyright text komen die NIET de lage opacity overneemt van de background, wat nu gebeurt. De tekst in classe footertext neemt de lage opacity over:

<!-- Footer -->
<footer id="footer" class="clearfix">
<div class="footertext">&copy; Linda </div>
</footer>

footer {
margin-top: 10px;
height: 80px;
background: #662d91; /* For browsers that do not support gradients */
background: -webkit-linear-gradient(#fcfcfc, #662d91); /* For Safari 5.1 to 6.0 */
background: -o-linear-gradient(#fcfcfc, #662d91); /* For Opera 11.1 to 12.0 */
background: -moz-linear-gradient(#fcfcfc, #662d91); /* For Firefox 3.6 to 15 */
background: linear-gradient(#fcfcfc, #662d91); /* Standard syntax */
opacity: 0.2;
}
.footertext {

text-align: center;
padding-top: 35px;
color: #662d91; /* deze kleur wordt niet helder weergegeven */

}

Ik kan niet met rgba werken omdat de background een gradient krijgt
Getagd:

Reacties

  • Met rgba kun je ook gradients maken.
    nuet
  • bewerkt wo 27 jan 2016
    PMPosts: 879
    vinTage schreef:: Met rgba kun je ook gradients maken.
    Idd, dit levert hetzelfde effect en nu is de content wel helder:

    background: -webkit-linear-gradient(bottom, rgba(252,252,252,0), rgba(102,45,145,0.2)); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(bottom, rgba(252,252,252,0), rgba(102,45,145,0.2)); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(bottom, rgba(252,252,252,0), rgba(102,45,145,0.2)); /* For Firefox 3.6 to 15 */
    background: linear-gradient(to bottom, rgba(252,252,252,0), rgba(102,45,145,0.2)); /* Standard syntax (must be last) */

Login of Registreer om te reageren.