ওয়েব পেইজের জন্য ফুল পেইজ ব্যাকগ্রাউন্ড ইমেজ।

প্রায় ওয়েব সাইটেই দেখা যায় পেছনে ফুল পেইজ ব্যাকগ্রাউন্ড ইমেজ থাকে  চাই যা ব্রাউজারের পুরো জায়গা জুড়ে দেখা যায়। সিএসএস ব্যাবহার করে আমরা সহজেই এমন ব্যাকগ্রাউন্ড দিতে পারি।  উদাহরন হিসেবে এটা দেখতে পারেন।  এখানে গিয়ে জুম ইন আউট করে দেখুন, ব্যাকগ্রাউন্ড সব সময় একই সাইজে থাকে। 

আর এমন ব্যাকগ্রাউন্ড দেওয়া খুব সহজঃ


html {
 background: url(http://jakir.me/wp-content/uploads/2013/03/Future_Billings.jpg) no-repeat center center fixed;
 -webkit-background-size: cover;
 -moz-background-size: cover;
 -o-background-size: cover;
 background-size: cover;
 }

আর পুরো উদাহরনের কোডঃ


<html>
 <head>

<style>
 html {
 background: url(http://jakir.me/wp-content/uploads/2013/03/Future_Billings.jpg) no-repeat center center fixed;
 -webkit-background-size: cover;
 -moz-background-size: cover;
 -o-background-size: cover;
 background-size: cover;
 }

#container{
 width:700px;
 margin:50 auto;
 padding:20px;
 background:#fff;
 opacity:.6;
 }

</style>
 </head>
 <body>

 <div id="container">
 <h1>Here we use full width image as a background</h1>
 <img src="http://jakir.me/wp-content/uploads/2013/03/fullpagebackground.png" />
 </div>
 </body>

</html>

One thought on “ওয়েব পেইজের জন্য ফুল পেইজ ব্যাকগ্রাউন্ড ইমেজ।

Leave a Reply