George George - 6 months ago 66
CSS Question

Dotted background overlay effect in CSS

I'm trying to achieve the background effect on this website:
http://mountaintheme.com/themeforest/mountain/home.html

The background pictures seem to be covered in a dotted overlay sort of thing.

Is there a way to create this effect with CSS only?

Answer

Here's one way of doing it.

<body>
 <div id="overlay">
     image
</div>

<div id="page">
 <div id="content">
  ....

Basically, you add a container outside your page container. Add a fixed position for it, and add a pseudo element :after to it and give it a background image.