সম্পূর্ণ ইমেজ গ্যালারির এরিয়া,ব্যাকগ্রাউন্ড এবং বর্ডার নির্ধারণ

সম্পূর্ণ ইমেজ গ্যালারিটি <div id="container"></div> এর মধ্যে অবস্থিত।একটা 345px X 425px এর ইমেজ গ্যালারির জন্য স্ট্যাইল শীটে লেখতে হবে #container{width:345px; height:425px;}। #999 অর্থাৎ গ্রে কালার এর ব্যাকগ্রাউন্ড তৈরির জন্য লেখতে হবে background:#999; এবং 1px এর কালো রঙের বর্ডার তৈরির জন্য লেখতে হবে border:1px #000 solid;।ইমেজ সমূহকে পরস্পর থেকে কিছুটা দূরত্বে রাখার জন্য padding:7px 2px 7px 7px; লেখতে হয়।

সম্পূর্ণ ইমেজ গ্যালারির এরিয়া,ব্যাকগ্রাউন্ড এবং বর্ডার এর জন্য স্ট্যাইল

#container{
background:#999;
width:345px;
height:425px;
padding:7px 2px 7px 7px;
border:1px #000 solid;
position:relative;}

অনুশীলন প্রজেক্ট

<html>
<head>
<title> Gallery</title>
<style>
#container{
background:#999;
width:345px;
height:425px;
padding:7px 2px 7px 7px;
border:1px #000 solid;
position:relative;}
</style>
</head>
<body>
<div id="container">
<a class="galpic"><img /><span><img /><br /><i> text </i></span></a>
<a class="galpic"><img /><span><img /><br /><i> text </i></span></a>
<br />
<a class="galpic"><img /><span><img /><br /><i> text </i></span></a>
<a class="galpic"><img /><span><img /><br /><i> text </i></span></a>
<br />
<div id="screen"><h1>Gallery<br />Screen</h1></div>
</div>
</body>
</html>

একটা নোটপ্যাড open করে উপরের code টুকু লিখে file মেনু থেকে Save as এ ক্লিক করে File name: index.html , Save as type : All files, দিয়ে save করে index.html ফাইলটি Mozilla Firefox দিয়ে open করলে নিচে প্রদর্শিত ছবির মত দেখাবে।