You can have a background be semi-transparent. To add it to a widget, edit the page where that widget is located. Hover over the widget with your cursor and click on the edit link that pops up. On the right hand side you’ll see an “attributes” tab. Click on it and you’ll see a box for Custom CSS. That will apply to the widget element directly. You can specify a background there like this:
background-color: rgba(255, 255, 255, 0.7);
That is an RGBA color code for white that is 70% opaque. The first three numbers set the actual hue (red, green and blue) and the last one sets the opacity on a scale from 0 (transparent) to 1.0 (completely opaque). Feel free to adjust those to fit your needs.
For the header, you can add something like this to your child theme’s style.css file:
#header {
background-color: rgba(0, 0, 0, 0.4);
}
Which would give it a black background that is 40% opaque. If you run into questions or trouble, let me know.
Have a great day,
Bill