নিচের project টি মূলত এট্রিবিউট সিলেক্টর গুলি ভালবাবে বুঝার সহায়তা করবে। এতে লক্ষ্য করে দেখুন, যে Button টিতে click করা হচ্ছে ঐ 
Button সংস্লিষ্ট element টিতে লাল রঙের একটি border সৃষ্টি হচ্ছে।
Project এর বর্ননা : যখন button element এ ক্লিক করা হচ্ছে তখন ঐ button এর উপরে যে text আছে তা str নামক veriable এ $(this).text() এর মাধ্যমে সংরক্ষন করা হয়েছে। এখানে $(this) current attribute কে নির্দেশ করে। পরবর্তী লাইন [$(‘a’).css(“border”, “0px solid #000000”)] দ্বারা সকল anchor element এর border color reset করা হয়েছে। এর পর যে element টি Button সংস্লিষ্ট selector কে match করবে তাতে border তৈরি হবে $(str).css(“border”, “1px solid #ff0000”) এই লাইনটি দ্বারা।
project Code :
[sourcecode language=”html”]
<html>
<head>
<title>jQuery attribute selector example</title>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<style type="text/css">
div, a{
padding:16px;
}
#msg{
padding:8px;
hright:100px;
}
</style>
</head>
<body>
<h1>jQuery attribute selector example</h1>
<div id="msg"></div>
<div>
<a rel="nofollow" href="http://www.google.com" lang="en-US">
Google – <a rel="nofollow" href="http://www.google.com" lang="en-US">
</a>
</div>
<div>
<a href="http://www.yahoo.com" lang="en">
Yahoo – <a href="http://www.yahoo.com" lang="en" >
</a>
</div>
<div>
<a href="http://www.abc-yahoo.com" lang="-en">
Yahoo – <a href="http://www.abc-yahoo.com" lang="-en">
</a>
</div>
<div class="Hello-jQuery">
class = "Hello-jQuery"
</div>
<div class="Hello jQuery">
class = "Hello jQuery"
</div>
<div class="HellojQuery">
class = "HellojQuery"
</div>
<br/><br/>
<button title="Has Attribute Selector">a[rel]</button>
<button title="Attribute Equals Selector">a[rel=nofollow]</button>
<button title="Attribute Not Equal Selector">a[rel!=nofollow]</button>
<button title="Attribute Starts With Selector">a[rel^=nof]</button>
<button title="Attribute Ends With Selector">a[rel$=low]</button>
<button title="Attribute Contains Selector">a[href*=’yahoo.com’]</button>
<button title="Attribute Contains Prefix Selector">a[lang|=en]</button>
<button title="Attribute Contains Word Selector">div[class~=jQuery]</button>
<button id="reset">Reset It</button>
<script type="text/javascript">
$("button").click(function () {
var str = $(this).text();
$(‘a’).css("border", "0px solid #000000");
$(str).css("border", "1px solid #ff0000");
$(‘#msg’).html("<h4>Attribute Selector : " + str + "</h4>");
});
$("#reset").click(function () {
location.reload();
});
</script>
Click Me to Show Demo
………………………………………………………………………………
আলোকিত একটা সুন্দর সমৃদ্ধ পৃথিবী আমাদের প্রত্যেকেরই স্বপ্ন । আসুন আমাদের মেধা পরিশ্রম কে বিজ্ঞান সম্মতভাবে ব্যবহার করে, আমাদের স্বপ্ন পূরণে অংশ গ্রহণ করি। আজ এখানেই শেষ করলাম। “HAVE A GOOD PROGRAMMING”
This project is too nice to understand selector. Thank U Boss
Geneous project
@All, Thanks……….
CSS is designed primarily to enable the separation of document content (written in HTML or a similar markup language) from document presentation, including elements such as the layout, colors, and fonts.This separation can improve content accessibility, provide more flexibility and control in the specification of presentation characteristics, enable multiple pages to share formatting, and reduce complexity and repetition in the structural content (such as by allowing for tableless web design). ,-
My favorite internet site
<http://www.healthmedicinelab.com