ITADN

Enlarge on hover CSS

#68OpenSteveJohnSteele 创建于 2024-01-18
S
SteveJohnSteelecommented
/* Apply styles to images with alt text containing "enlarge" */ .markdown-preview-view img[alt*="enlarge"] { display: block; margin-left: auto; margin-right: auto; transition: transform 0.25s ease; } /* Hover effect on images with alt text containing "enlarge" */ .markdown-preview-view img[alt*="enlarge"]:hover { -webkit-transform: scale(1.8); /* experiment with values */ transform: scale(2); } It only targets links with the "enlarge" tag. How to use: ![enlarge | 100](https://upload.wikimedia.org/wikipedia/commons/e/e0/SNice.svg) or ![some text enlarge more text | 100](https://upload.wikimedia.org/wikipedia/commons/e/e0/SNice.svg) This allows the user to set a default size and still have the enlarged hover effect.
0 条评论