relative и absolute 2

Создайте веб-страницу, показанную на рис. 1. Поверх фотографии в правом нижнем углу выводится картинка с полупрозрачным фоном (прозрачность 50%).

Рис. 1

Файлы

Image icon dessert.jpg
Image icon expand.png
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Увеличить фото</title> <style> figure { position: relative; display: inline-block; } img { display: block; } .expand { position: absolute; width: 30px; height: 30px; right: 15px; bottom: 15px; padding: 5px; background: rgba(255, 255, 255, 0.5) url(/example/image/expand.png) 50% 50% no-repeat; background-size: 30px; border: 1px solid #333; } </style> </head> <body> <figure> <img src="image/dessert.jpg" alt="Десерт"> <a href="#" class="expand"></a> </figure> </body> </html>
Как научиться разрабатывать сайты