সিএসএস সিলেক্টর - Css Selectors



সিলেক্টর - Selector

সিএসএস এ, যে এলিমেন্ট স্টাইল করার জন্য সিলেক্ট করতে চান, তার জন্য সেই সিলেক্টরের টাইপ ব্যবহার করুন। "সিএসএস" কলাম সেই সিলেক্টর ার সিএসএস ভার্সন নির্দেশ করে।

সিলেক্টর উদাহরণ উদাহরণের বর্ণনা সিএসএস
class .intro class="intro" এর সাথে সকল এলিমেন্ট সিলেক্ট করে।
#id #firstname id="firstname" এর সকল এলিমেন্ট সিলেক্ট করে।
* * সকল এলিমেন্ট সিলেক্ট করে।
element p সকল <p> এলিমেন্ট সিলেক্ট করে।
element,element div, p সকল <div> এবং <p> এলিমেন্ট সিলেক্ট করে।
element element div p <div> এলিমেন্টের ভিতর সকল <p> এলিমেন্ট সিলেক্ট করে।
element>element div > p সকল <p> এলিমেন্ট সিলেক্ট করে , যেখানে <div> প্যারেন্ট এলিমেন্ট।
element+element div + p <div> এলিমেন্টের পরের সকল <p> এলিমেন্ট সিলেক্ট করে।
element1~element2 p ~ ul <p> এলিমেন্টের পূর্বের সকল <ul> এলিমেন্ট সিলেক্ট করে।
[attribute] [target] টার্গেট এট্রিবিউটসহ এলিমেন্টগুলোকে সিলেক্ট করে। .২
[attribute=value] [target=_blank] সকল target="_blank"এর সাথে সকল এলিমেন্টগুলোকে সিলেক্ট করে।
[attribute~=value] [title~=flower] টাইটেল(title) এট্রিবিউট সাথে "flower" সংযুক্ত শব্দটি , সে সকল এলিমেন্টগুলোকে সিলেক্ট করে।
[attribute/=value] [lang/=en] ল্যাং(lang) এট্রিবিউট যার মান "en" দিয়ে শুরু, সে সকল এলিমেন্টগুলোকে সিলেক্ট করে।
[attribute^=value] a[href^="https"] সকল <a> এলিমেন্ট যার href এট্রিবিউটের মান "https" দ্বারা শুরু হয়েছে, সে সকল এলিমেন্টগুলোকে সিলেক্ট করে।
[attribute$=value] a[href$=".pdf"] সকল <a> এলিমেন্ট যার href এট্রিবিউটের মান "pdf" দ্বারা শেষ হয়েছে, সে সকল এলিমেন্টগুলোকে সিলেক্ট করে।
[attribute*=value] a[href*="sattacademy"] সকল <a> এলিমেন্ট যার href এট্রিবিউটের মান সাব স্ট্রিংয়ের মধ্যে থাকবে "sattacademy", সে সকল এলিমেন্টগুলোকে সিলেক্ট করে।
:active a:active সক্রিয় লিঙ্ক সিলেক্ট করে।
::after p::after প্রত্যেক <p> এলিমেন্টের পরে কিছু সংযুক্ত করা।
::before p::before প্রত্যেক <p> এলিমেন্টের আগে কিছু সংযুক্ত করা।
:checked input:checked সকল checked <input> এলিমেন্ট সিলেক্ট করে।
:disabled input:disabled সকল disabled <input> এলিমেন্ট সিলেক্ট করে।
:empty p:empty সকল <p> এলিমেন্ট যার কোনো চিলড্রেন এলিমেন্ট নেই (টেক্সট নোডসহ)
:enabled input:enabled সকল enabled <input> এলিমেন্ট সিলেক্ট করে।
:first-child p:first-child সকল <p> এলিমেন্ট সিলেক্ট করে যেটা প্যারেন্টের প্রথম চাইল্ড
::first-letter p::first-letter সকল <p> এলিমেন্টের প্রথম বর্ণ সিলেক্ট করে।
::first-line p::first-line সকল <p> এলিমেন্টের প্রথম লাইন সিলেক্ট করে।
:first-of-type p:first-of-type সকল <p> এলিমেন্ট সিলেক্ট করে যেটা প্যারেন্টের প্রথম <p> এলিমেন্ট।
:focus input:focus ফোকাসসহ ইনপুট এলিমেন্ট সিলেক্ট করে।
:hover a:hover মাউস হোভারের লিঙ্ক সিলেক্ট করে।
:in-range input:in-range নির্দিষ্ট সীমার মানের ইনপুট এলিমেন্ট সিলেক্ট করে।
:invalid input:invalid যেসকল ইনপুট এলিমেন্টে অকার্যকর মান রয়েছে তাদের সিলেক্ট করে।
:lang(language) p:lang(it) যেসকল <p> এলিমেন্টের lang এট্রিবিউট সমান "it"(Italian) তাদের সিলেক্ট করে।
:last-child p:last-child সকল <p> এলিমেন্ট সিলেক্ট করে যেটা প্যারেন্টের শেষ চাইল্ড
:last-of-type p:last-of-type সকল <p> এলিমেন্ট সিলেক্ট করে যেটা প্যারেন্টের শেষ এলিমেন্ট
:link a:link সকল আনভিজিটেড লিঙ্ক সিলেক্ট করে।
:not(selector) :not(p) <p> এলিমেন্ট ছাড়া সকল এলিমেন্ট সিলেক্ট করে।
:nth-child(n) p:nth-child(2) সকল <p> এলিমেন্ট সিলেক্ট করে যেটা প্যারেন্টের দ্বিতীয় চাইল্ড
:nth-last-child(n) p:nth-last-child(2) সকল <p> এলিমেন্ট সিলেক্ট করে যেটা নিচ থেকে প্যারেন্টের দ্বিতীয় চাইল্ড
:nth-last-of-type(n) p:nth-last-of-type(2) সকল <p> এলিমেন্ট সিলেক্ট করে যেটা শেষের চাইল্ড থেকে প্যারেন্টের দ্বিতীয় <p> এলিমেন্ট
:nth-of-type(n) p:nth-of-type(2) সকল <p> এলিমেন্ট সিলেক্ট করে যেটা প্যারেন্টের দ্বিতীয় এলিমেন্ট।
:only-of-type p:only-of-type সকল <p> এলিমেন্ট সিলেক্ট করে যেটা প্যারেন্টের একমাত্র <p> এলিমেন্ট
:only-child p:only-child সকল <p> এলিমেন্ট সিলেক্ট করে যেটা প্যারেন্টের একমাত্র চাইল্ড।
:optional input:optional no "required" এট্রিবিউটসহ ইনপুট এলিমেন্টকে সিলেক্ট করে।
:out-of-range input:out-of-range অনির্দিষ্ট সীমার মানের ইনপুট এলিমেন্ট সিলেক্ট করে।
:read-only input:read-only "readonly" এট্রিবিউট নির্দেশিত এলিমেন্টগুলোকে সিলেক্ট করে।
:read-write input:read-write "readonly" এট্রিবিউট নির্দেশিত নয় এরকম এলিমেন্টগুলোকে সিলেক্ট করে।
:required input:required "required" এট্রিবিউটসহ ইনপুট এলিমেন্টকে সিলেক্ট করে।
:root :root ডকুমেন্ট রুট এলিমেন্টকে সিলেক্ট করে
::selection ::selection ব্যবহারকারী দ্বারা নির্বাচিত একটি এলিমেন্টের অংশ সিলেক্ট করে।  
:target #news:target বর্তমানে স্বক্রিয় #news এ্লিমেন্টকে সিলেক্ট করে (সেই প্রধান নাম রাখার জন্য url এ ক্লিক করুন)
:valid input:valid কার্যকর মান সম্পন্ন ইনপুট এলিমেন্টগুলোকে সিলেক্ট করে।
:visited a:visited সকল ভিজিটেড লিঙ্ক সিলেক্ট করে।






এই ওয়েব সাইট এর সমস্ত টিউটোরিয়াল, সার্কিট ডায়াগ্রাম, উদাহরণ ইত্যাদি খুব সহজ ও সাধারণ ভাবে তৈরি করা হয়েছে। টিউটোরিয়াল, সার্কিট ডায়াগ্রাম, উদাহরণ ইত্যাদির ভুল পরিহার করার জন্য বার বার যাচাই করা হয়েছে, কিন্তু আমরা এর পূর্ণ নিশ্চয়তা ও দায়ভার বহন করি না। যখন আপনি এই সাইটটি ব্যবহার করেন, আমরা ধরে নেই যে আপনি পড়েছেন এবং সম্মত আছেন আমাদের টার্মস অফ ইউস (Terms of use) এবং প্রাইভেসি পলিসি( Privacy policy) সম্পর্কে।

Copyright 2016-2018 by websschool.com, All Rights Reserved.