CSS চাইল্ড সিলেক্টর ব্যবহার করে নির্দিষ্ট পেরেন্ট এলিমেন্টের সব চাইল্ড এলিমেন্ট সিলেক্ট করা হয়।
সিনট্যাক্স
CSS চাইল্ড সিলেক্টরের সিনট্যাক্স:
element > element { /*declarations*/ }উদাহরণ
নিচের উদাহরণগুলো CSS ডিসেন্ডেন্ট সিলেক্টর প্রদর্শন করে:
<!DOCTYPE html> <html> <head> <style> * { padding: 5px; } article > div { border: dashed midnightblue; width: 45%; } div > p { font-size: 20px; font-style: italic; box-shadow: inset 0 0 8px orange; } </style> </head> <body> <h2>Examination Detail</h2> <article> <div>Exam Details</div> <div><p>Exam begins at 11AM.</p></div> <span><div> Do not bring cell phone.</div></span> <div> <div>Candidates should reach the center till 10:45.</div> <br/> The candidates need to be bring the Admit Card. </div> </article> </body> </html>আউটপুট
এটি নিচের আউটপুট দেবে:

উদাহরণ
<!DOCTYPE html> <html> <head> <style> div { margin: auto; width: 200px; padding: 30px; background-color: moccasin; } div > div { box-shadow: inset 0 0 8px mediumseagreen; border-top-right-radius: 50%; border-bottom-left-radius: 50%; } </style> </head> <body> <div> <div></div> </div> </body> </html>আউটপুট
এটি নিচের আউটপুট দেবে:
