html - make picture fit in css circle -
is there way can make picture fit automatically in css circle? fx if user add picture there 500px * 500px, circle 100px * 100px. when upload picture now, picture filling out screen, instead of staying inside circle.
<html> <head> <style> #circle { border-radius:50% 50% 50% 50%; width:100px; height:100px; } </style> </head> <body> <img src="skin-tone.jpg" id="circle"> </body> </html>
try css
#circle { background: skin-tone.jpg; background-size: cover; border-radius:50% 50% 50% 50%; width:100px; height:100px; }
Comments
Post a Comment