সাধারণ শিরোনামে সিউডো ক্লাসের ব্যবহার
কোন একটি ওয়েব পেজে অনেকগুলো আর্টিকেল থাকতে পারে এবং প্রত্যেকটি আর্টিকেলের একটি করে মূল শিরোনাম থাকতে পারে।আর্টিকেল গুলো <p></p> ট্যাগের মাধ্যমে তৈরি। চিন্তা করা হল যে পেজের শুরুতে একটা <p></p> ট্যাগ নিয়ে সকল শিরোনাম গুলো প্রদর্শন করা হবে।শিরোনাম গুলো <b></b> দ্বারা তৈরি ।তাহলে প্রথম <p></p> এর সবগুলো <b></b> এর জন্য স্ট্যাইল তৈরি করতে হবে।এজন্য স্ট্যাইলশীটে সিলেক্টর হিসেবে লেখতে হবে p:first-child b। পেজে আরো অনেক <p></p> এবং এর মধ্যে <b></b> থাকতে পারে সেগুলোর জন্য কোন স্ট্যাইল তৈরি হবে না।
অনুশীলন প্রজেক্ট
<html>
<head>
<title> www.tutohost.com</title>
<style>
body{background:#FFD;}
p{font-family:Arial, Helvetica, sans-serif;
background:#FCF;
font-size:12px;
border:#F39 5px solid;
padding:10px;}
p > b:first-child
{color:#366;
font-size:16px;}
p:first-child b
{color:#F00;
font-size:20px;}
</style>
</head>
<body >
<p>
<b>First Heading</b><br/ ><br/ >
<b>Second Heading</b><br/ ><br/ >
<b>Third Heading</b><br/ ><br/ >
</p>
<p>
<b>First Heading</b><br/ ><br/ >
We are bangladeshi <b>Hostgator</b> hosting provider. The world wide technical and support team is working for your best movement.
</p>
<p>
<b>Second Heading</b><br/ ><br/ >
We are bangladeshi <b>Hostgator</b> hosting provider. The world wide technical and support team is working for your best movement.
</p>
<p>
<b>Third Heading</b><br/ ><br/ >
We are bangladeshi <b>Hostgator</b> hosting provider. The world wide technical and support team is working for your best movement.
</p>
</body>
</html>
একটা নোটপ্যাড open করে উপরের code টুকু লিখে file মেনু থেকে Save as এ ক্লিক করে File name: index.html , Save as type : All files, দিয়ে save করে index.html ফাইলটি Mozilla Firefox দিয়ে open করলে নিচে প্রদর্শিত ছবির মত দেখাবে।
তিনি ইলেকট্রিক্যাল ইঞ্জিনিয়ারিং এ লেখাপড়া করছেন। টিউটোরিয়ালবিডি ও বিজ্ঞানপ্রযুক্তি ব্লগে তিনি ইলেক্ট্রনিক্স সহ বিভিন্ন টেকনোলজি বিষয়ে লিখে থাকেন। বর্তমানে তিনি লেখাপড়ার পাশাপাশি টিউটোহোস্টে কর্মরত আছেন।
কপি রাইট © ২০১১থেকে যতদিন চলবে সর্বস্বত্ত্ব সংরক্ষিত