点击图片1.全屏阅览2.下载3.关闭纯纯html css js

要实现图片点击全屏预览的功能，可以使用JavaScript和CSS来实现。以下是一个简单的示例代码：

html

<!DOCTYPE html>
<html>
<head><meta charsett="UTF-8"><title>图片点击全屏预览</title><style>/* 全屏预览样式 */.fullscreen {position: fixed;top: 0;left: 0;width: 100%;height: 100%;background-color: rgba(0, 0, 0, 0.8);display: flex;justify-content: center;align-items: center;z-index: 9999;}.fullscreen img {max-width: 90%;max-height: 90%;}.fullscreen img:hover {cursor: pointer;}/* 关闭按钮样式 */.close-btn {position: absolute;top: 10px;right: 10px;color: #fff;font-size: 24px;cursor: pointer;}/* 下载按钮样式 */.download-btn {position: absolute;bottom: 10px;right: 10px;color: #fff;font-size: 24px;cursor: pointer;}</style>
</head>
<body><img src="image.jpg" alt="图片" onclick="openFullscreen(this)"><script>function openFullscreen(img) {// 创建全屏预览容器var fullscreenDiv = document.createElement("div");fullscreenDiv.classList.add("fullscreen");// 创建关闭按钮var closeBtn = document.createElement("span");closeBtn.classList.add("close-btn");closeBtn.innerHTML = "&times;";closeBtn.onclick = function() {closeFullscreen();};fullscreenDiv.appendChild(closeBtn);// 创建下载按钮var downloadBtn = document.createElement("span");downloadBtn.classList.add("download-btn");downloadBtn.innerHTML = "&#x2193;";downloadBtn.onclick = function() {downloadImage(img.src);};fullscreenDiv.appendChild(downloadBtn);// 创建图片元素var fullscreenImg = document.createElement("img");fullscreenImg.src = img.src;fullscreenDiv.appendChild(fullscreenImg);// 添加全屏预览容器到页面document.body.appendChild(fullscreenDiv);// 禁用滚动document.body.style.overflow = "hidden";}function closeFullscreen() {// 移除全屏预览容器var fullscreenDiv = document.querySelector(".fullscreen");fullscreenDiv.parentNode.removeChild(fullscreenDiv);// 启用滚动document.body.style.overflow = "auto";}function downloadImage(src) {// 创建一个隐藏的链接并设置下载属性var link = document.createElement("a");link.href = src;link.download = "image.jpg";link.style.display = "none";// 将链接添加到页面并模拟点击document.body.appendChild(link);link.click();document.body.removeChild(link);}</script>
</body>
</html>