Support » Theme: Twenty Twenty-One » transparency on textbox

  • Resolved jazzz99

    (@jazzz99)


    hello,
    I’ll like to have transparency (opacity setting) on textbox.
    It means that the background behind the text is a solid color with transparency, so we can see the website background through the background solid color of the textbox, so it will be nice looking and easy reading.
    I will like to have this on any block text of the website.
    It seems that we can choose a solid color for the background of a textbox, but we can’t choose any transparency, opacity level or alpha transparency.
    There is no plugin for that.
    Should I use a CSS style code?
    Thanks by advance for your help !

Viewing 5 replies - 1 through 5 (of 5 total)
  • Moderator Kathryn P.

    (@zoonini)

    Hi @jazzz99, if you can provide a link to a page or post with an example of a block where you’d like to change the opacity of the background colour, I’d be glad to look at some CSS for you.

    Thread Starter jazzz99

    (@jazzz99)

    thank you for your help,
    I’d like to add an opacity on the white textbox,
    Here’s my website :
    http://bulles-de-swing.fr/

    • This reply was modified 1 month ago by jazzz99.
    Moderator Kathryn P.

    (@zoonini)

    @jazzz99 Thanks for the link!

    You can target all elements with a white background colour with this CSS, to give it a 50% opacity (0.5). Of course you can adjust that as you like, so for example, if you prefer 20%, you can change 0.5 to 0.2. The numbers 255, 255, 255, represent the colour white. You can find other RGB colour codes using a colour tool like https://htmlcolorcodes.com/

    
    /* Add white background with opacity */
    .has-white-background-color {
      background-color: rgba(255, 255, 255, 0.5) !important; 
    }

    If you’d like to target elements more specifically – such as varying opacities on different pages – that would entail more code. If that’s the case, feel free to show me what you’d like to do and I’ll be glad to have another look.

    Thread Starter jazzz99

    (@jazzz99)

    awesome ! thank you !

    Moderator Kathryn P.

    (@zoonini)

    Avec plaisir! 🙂

Viewing 5 replies - 1 through 5 (of 5 total)
  • You must be logged in to reply to this topic.