How to select anchor tag which are inside of a Paragraph tag?-CodePudding

I want to individually select the first anchor tag and last anchor tag of the <p> tag.

<div >
  <img src="/assets/images/avatar-mark-webber.webp" alt="Mark Webber image">
  <p> <a href="#">Mark Webber </a> reacted to your recent post <a href="#">My first tournament today!</a></p>
  <span>1m ago</span>
</div>

CodePudding user response：

By using :first-child and :last:child css selectors.

p a:first-child {
  background-color: yellow;
}

p a:last-child {
  background-color: yellow;
}

<p>
  <a>This anchor is the first child of its parent (p).</a>
  <a>This anchor is the second child of its parent (p).</a>
  <a>This anchor is the third child of its parent (p).</a>
</p>