Build a rectangle frame with a transparent circle using CSS only

Question

I need to implement a design to my webpage butI am kind of newbie with CSS.

What I am trying is to add a frame above the user picture. For example, for any size of imag

Answer 1

You should draw the square, then the circle on top of it and finally put the image, this will produce the result you want.
Check there for how to trace a circle in CSS.