Active/Current status of link in Query Loop is not work

1

Apprreciate any help🙏

I use query loop to build the products’ category list on header for quick access. But the link in loop cannot show the active status when it comes to the matching page.

<query loop here>
 <a div href=''.../product-1'>
   <img>
   <p>...</p>
 </a>
</query loop here>

When comes to www…/prodcut-1, even given active on , it quick flesh on hover or click, but not keep active style on the current page.