Viewing 6 replies - 1 through 6 (of 6 total)
  • You can use the directive

    opacity: NN;

    Where NN is a number between 0 and 1, where 0 means totally transparent, 1 totally opaque, and anything in between a different grade of transparency.

    The social icons are from the plugin social ring, I believe.

    That site is actually using a transparent image as the background for that semi-transparent background- in the CSS here:

    #page_content_wrapper {
        background: url("../images/000_80.png") repeat scroll 0 0 rgba(0, 0, 0, 0);
        border: 1px solid #666666;
        border-radius: 10px 10px 10px 10px;
        box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.7);
        margin: auto;
        padding-bottom: 50px;
        position: relative;
        top: 100px;
        width: 900px;
    }

    That problem with using opacity in CSS is that it’s inherited by all elements contained within the with that style – which is sometimes not so desirable.

    Thread Starter wiedzmin137

    (@wiedzmin137)

    Thanks @daprela, but where I must add that (in expund CSS of corse) tp make transparent only to (https://servmine.net/) place from “Aktualizacja 1.6.4” to footer down side of page.

    And that plugin what you say don’t add that. I saw those pictures in expound theme, so this can do it somehow.

    Theme Author Konstantin Kovshenin

    (@kovshenin)

    Here’s some CSS you can try:

    #page { background: none; }
    .site-main { background: white; opacity: 0.8; }

    Use a Custom CSS plugin or a child theme to apply those changes.

    Hope that helps!

    Thread Starter wiedzmin137

    (@wiedzmin137)

    So nice… But is there possibility to make text, medias (e.g. photos) non transparent (and can I modify border to not be rounded and: https://img849.imageshack.us/img849/7377/dh1l.png)? And do you know something about those social icons on @top? Thanks and sorry for so much questions.

    Theme Author Konstantin Kovshenin

    (@kovshenin)

    Since they’re parent to the container with the opacity, there’s really no good way to have the container transparent and the children with no opacity. Perhaps you can have an rgba background color instead of opacity, but that might not work for some browsers:

    .site-main { background: rgba(255,255,255,0.8); }

    Social icons have been discussed before: https://www.ads-software.com/support/topic/social-sharing-buttons-on-the-menu-bar?replies=9

    Cheers!

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘Transparent’ is closed to new replies.