选择图片后显示缩略图（自动生成缩略图）

最新推荐文章于 2022-09-09 11:42:29 发布

艾欢欢

最新推荐文章于 2022-09-09 11:42:29 发布

阅读量2.8k

点赞数 2

分类专栏： JavaScript 文章标签：缩略图 drop drag 自动生成缩略图

本文链接：https://blog.csdn.net/AiHuanhuan110/article/details/90605100

版权

参考：使用drop实现点击和拖放选择/上传文件

下面是完整代码，看注释：

<!DOCTYPE html>
<html lang="en">

<head>
	<meta charset="UTF-8">
	<title>显示选择图片的缩略图</title>
	<style>
		#dropbox {
    
		width: 400px;
		height: 70px;
		line-height: 70px;
		text-align: center;
		border: 2px dashed #999;
		border-radius: 5px;
		background: #fbfbfb;
		color: #666;
	}

	#preview>img {
    
		height: 80px;
		margin: 7px;
		border: 1px solid #666;
		border-radius: 4px;
		box-shadow: 3px 3px 3px #bbb;
	}
	#outbox{
    
		display: inline-block;
		position

最低0.47元/天解锁文章

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

艾欢欢

关注关注

2
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
选择图片后显示缩略图（自动生成缩略图）

下面是完整代码，看注释：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>显示选择图片的缩略图</title> <style> #dropbox { width: 400px; height: 70px;...
复制链接

扫一扫