CSS-এ অ্যাট্রিবিউট সিলেক্টর ব্যবহার করে বিশেষ বৈশিষ্ট্য সহ HTML উপাদানগুলিতে শৈলী প্রয়োগ করুন। অ্যাট্রিবিউট সিলেক্টরে নিম্নলিখিত নিয়মগুলি প্রয়োগ করা হয়েছে৷
৷-
p[lang] − ল্যাং এট্রিবিউট সহ সমস্ত অনুচ্ছেদ উপাদান নির্বাচন করে।
-
p[lang="fr"] − সমস্ত অনুচ্ছেদ উপাদান নির্বাচন করে যার lang বৈশিষ্ট্যের মান ঠিক "fr"।
-
p[lang~="fr"] − সমস্ত অনুচ্ছেদ উপাদান নির্বাচন করে যার lang বৈশিষ্ট্যে "fr" শব্দটি রয়েছে।
-
p[lang|="en"] − সমস্ত অনুচ্ছেদ উপাদান নির্বাচন করে যার lang অ্যাট্রিবিউটে এমন মান রয়েছে যা ঠিক "en" বা "en-" দিয়ে শুরু হয়৷
CSS অ্যাট্রিবিউট নির্বাচক -
সহ স্টাইলিং ফর্মের জন্য কোড নিচে দেওয়া হলউদাহরণ
<!DOCTYPE html>
<html>
<head>
<style>
body {
font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
}
input[type="text"] {
width: 300px;
display: block;
margin-bottom: 10px;
background-color: rgb(195, 250, 247);
font-size: 18px;
padding: 15px;
border: none;
}
input[type="submit"] {
padding: 10px;
font-size: 18px;
border: none;
outline: none;
background-color: rgb(75, 163, 16);
color: white;
}
input[type="password"] {
width: 300px;
padding: 10px;
background-color: red;
color: white;
border: none;
}
</style>
</head>
<body>
<h1>Css attribute selector example</h1>
<form>
<label for="fname">First name:</label><br />
<input type="text" id="fname" name="fname" value="Ron" />
<label for="lname">Last name:</label><br />
<input type="text" id="lname" name="lname" value="Shaw" />
<label for="pass">Password:</label><br />
<input type="password" id="pass" name="pass" value="password" />
<input type="submit" value="Submit" />
</form>
</body>
</html> আউটপুট
উপরের কোডটি নিম্নলিখিত আউটপুট −
তৈরি করবে
