Olá gusteps. Tentei fazer o que pediu:
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="utf-8">
<title></title>
<style type="text/css">
*{margin: ; padding: ;}
header{width: 100%; height: 100px; background-color: skyblue;}
.foto img{width: 200px; height: 200px; background-color: skyblue; border-radius: 100%; position: absolute; top: 10px; left: 10%;
</style>
</head>
<body>
<header>
<div class="foto">
<figure>
<img src="https://www.scriptbrasil.com.br/forum/uploads/monthly_2016_06/b94933835479d3f857105da86d9a7dba.jpg.ab204b46edc4a111f561e8fdd5f05a9f.jpg">
</figure>
</div>
</header>
</body>
</html>
Se você tem dificuldade com o CSS você pode baixar a apostila da W3C nesse link: http://www.w3c.br/Cursos/CursoCSS3