Subscribe:

Ads 468x60px

Showing posts with label no-repeat. Show all posts
Showing posts with label no-repeat. Show all posts

Monday, September 3, 2012

How to get Yahoo Wide Screen Effect in your website


Day Before yesterday I came across Yahoo Widescreen and was thinking, How we can achieve this with minimum APIs or code. 


After putting sometime, I realised that it's very much possible with Plain CSS only. Using the Selector, Property and Value correctly.

Selector is normally the HTML element you want to style.
Each declaration consists of a property and a value.
The property is the style attribute you want to change. Each property has a value.

Here for getting Yahoo Widescreen effect as shown in iFrame above. We need to set two things.

background-repeat: no-repeat; and  background-attachment: fixed;
So, a sample html code I have written below. Copy-Paste it to your local machine in .html format and open in browser to see the effect.