Fade in your website using CSS

If you would like to add a simple effect to your website that makes the page appear to fade in, you can do this through some simple CSS.

Add the following CSS.

Adjust the seconds as desired. This determines how quickly the page will fade in. Next, update your HTML body tag to include this onload method. This will tell the page to set the opacity to 1 when the page loads.

I have seen problems with this approach where the page stays blank because the opacity never sets properly. Use at your own risk.