By using First-child
selector we can select the first child of every parent element.
<style> b:first-child { color: red; } </style> <body> <b>This is 'b' element but it is not the first child.</b> <br /> <div> <b>This is the 'b' element and it is First child of parent div.</b> </div> <p> <b>This is the first child of the parent 'p' and it is 'b' element.</b><br /> <b>This is the second child of the parent 'p' and it is also 'b' element.</b> </p> <br /> <div> <b>This is the first child of the parent div in'b' element.</b><br /> <b>This is the second child of the parent div in 'b' element.</b> <p>This is the first child of the parent div in 'p' element.</p> <p>This is the second child of the parent div in 'p' element.</p> </div> <br /> </body>
In the above code snippet we have given first-child
selector to the <b>
element. So, that it will select the first child in the every <b>
element of its parent element and applies <style>
to that particular element. That is shown in the below output.
OUTPUT
Views: 3826 | Post Order: 18