Vue实现图文翻转

京绝古城

已于 2023-03-21 10:52:15 修改

阅读量244

点赞数

文章标签： vue.js

于 2023-03-20 22:21:35 首次发布

本文链接：https://blog.csdn.net/m0_70925112/article/details/129676794

版权

本文详细介绍了如何使用Vue.js实现图文翻转效果。首先通过Photoshop将图文切割成10×10的切片，保存为JPEG格式。接着，利用Excel创建序号并在记事本中批量添加到图片路径中。随后，在HBuilder或VSCode中编写代码，存储图片路径数组，并完成代码编写。最后展示实现后的翻转效果。

摘要由CSDN通过智能技术生成

1：首先使用PS对图文进行10×10切片

2：将图片导出储存为web所用格式，图片使用JPEG格式

3：导出后100张图片编写路径不好写，可以用excel编写序号然后经过记事本添加替换符号

4：打开HBuilder （vscode也可）

粘贴代码时写一个数组用来存放图片路径。

5：补全代码，如下

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
		<style>
			.content {
				border: 1px solid red

最低0.47元/天解锁文章

京绝古城

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
1
评论
Vue实现图文翻转

粘贴代码时写一个数组用来存放图片路径。
复制链接

扫一扫