分享一个超好看回忆相册(代码自取)

news2025/7/24 9:06:34

cc8b9af695d241f1abcc6a424efd5529.jpeg

目录

前言

正文

部分代码

单面截图

更改文档标题

更改图片

更改文字

源码


前言

Calabash Brothers

《葫芦兄弟》(又名:葫芦娃),是上海美术电影制片厂于1985-1987年原创出品的13集系列剪纸动画片,是中国动画第二个繁荣时期的代表作品之一,至今已经成为中国动画经典。讲述7只神奇的葫芦,7个本领超群的兄弟,为救亲人前赴后继,展开了与妖精们的周旋。

赠语

 童年就像是时间火车的车厢,直到火车驶向远方,就成了长大时对童年的追忆。童年就像是一段美好时光,而这,人生却只有一次,那是多么宝贵啊!童年就像是透明的水珠,当它到了哪个角落,就绝对不可能再还原。

正文

部分代码

<body>
<div class="slider">
  <div class="slider__slide slider__slide--active" data-slide="1">
    <div class="slider__wrap">
      <div class="slider__back"></div>
    </div>
    <div class="slider__inner">
      <div class="slider__content"> <a class="go-to-next">
        <h1>下一张<br>
          相册一</h1>
        <p style="color: red; font-size:36px;">1986</p></a> </div>
    </div>
  </div>
  <div class="slider__slide" data-slide="2">
    <div class="slider__wrap">
      <div class="slider__back"></div>
    </div>
    <div class="slider__inner">
      <div class="slider__content"> <a class="go-to-next">
        <h1>下一张<br>
          相册二</h1>
          <p style="color: blue; font-size:36px;">1986</p></a> </div>
    </div>
  </div>
  <div class="slider__slide" data-slide="3">
    <div class="slider__wrap">
      <div class="slider__back"></div>
    </div>
    <div class="slider__inner">
      <div class="slider__content"> <a class="go-to-next">
        <h1>下一张<br>
          相册三</h1>
          <p style="color:green; font-size:36px;">1986</p></a> </div>
    </div>
  </div>
  <div class="slider__slide" data-slide="4">
    <div class="slider__wrap">
      <div class="slider__back"></div>
    </div>
    <div class="slider__inner">
      <div class="slider__content"> <a class="go-to-next">
        <h1>下一张<br>
          相册四</h1>
          <p style="color:salmon; font-size:36px;">1986</p></a> </div>
    </div>
  </div>
  <div class="slider__slide" data-slide="5">
    <div class="slider__wrap">
      <div class="slider__back"></div>
    </div>
    <div class="slider__inner">
      <div class="slider__content"> <a class="go-to-next">
        <h1>下一张<br>
          相册五</h1>
          <p style="color:purple; font-size:36px;">1986</p></a> </div>
    </div>
  </div>
  <div class="slider__indicators"></div>
</div>
<script src='../biaobai_xiangcePPT/js/jquery.1.7.1.min.js'></script> 
<script src="../biaobai_xiangcePPT/js/index.js"></script>
</audio>
</div>
</body>

 单面截图

更改文档标题

<title>回忆相册</title>

浏览器会以特殊的方式来使用标题,并且通常把它放置在浏览器窗口的标题栏或状态栏上。同样,当把文档加入用户的链接列表或者收藏夹或书签列表时,标题将成为该文档链接的默认名称。

把“回忆相册”换成你喜欢的标题 

更改图片

将键盘所指的图片路径换位你要用图片的路径,你能选的图片无非就两种第一种网图(右键复制图像链接) 第二种本地图片,将该html文件和图片放到同一文件夹里那么路径就是./加图片的文件名,./的意思就是当前目录

特别注意:图片板式要是横版的,不然不好看,推荐尺寸1920px-1200px

更改文字

 以第一张举例,红色箭头指的是上面大一点的白色字体,这个不是很建议更改

蓝色箭头指的是下面的小字,因为葫芦娃是1986年上海美术电影制片厂出品动画片,所以我加的是1986,如果你是送给girl friend 那么下面可以写女朋友的名字或5201314等

字体的颜色在color:red,把red换成你想换的字体颜色

字体大小在font-size:36px;嫌字体小了,把数值调大点,同理,嫌大了,调小点

源码

http://t.csdn.cn/LhnnR

👍+✏️+⭐️是对博主最大的鼓励与支持!!!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/16841.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

python基于PHP+MySQL家政管理系统的设计与实现

随着大家生活水平的提高,在生活中家政服务变得越来越受大家的欢迎,如何来选择一个好的员工就也变得越来越重要,如何让人们足不出户就能找到自己满意的家政人员是本网站要解决的主要问题,我们建立一个家政公司信息系统来实现需求者从网站中快速的获取正确真实的家政服务信息的手…

阿里云账户新手实名认证教程(超简单秒通过)

阿里云账号注册后需要实名认证后才可以使用&#xff0c;阿里云百科教大家快速实名认证的方法&#xff0c;不需要上传身份证的等信息&#xff0c;以个人认证为例&#xff0c;直接拿你当支付宝扫一下即可通过实名认证&#xff0c;阿里云百科来详细说下阿里云个人或企业实名认证方…

单链表(一篇带你掌握单链表)

在之前我们已经学习了顺序表&#xff0c;顺序表有一定的缺陷&#xff0c;比如需要扩容&#xff0c;在插入和删除时需要挪动数据等问题&#xff0c;在此基础上我们可以学习一一种新的数据结构-单链表&#xff0c;相对来说它可以按需申请空间&#xff0c;并且不需要挪动数据。 我…

Spring Security登录流程分析

本文内容来自王松老师的《深入浅出Spring Security》&#xff0c;自己在学习的时候为了加深理解顺手抄录的&#xff0c;有时候还会写一些自己的想法 登录流程分析 要搞请求Spring Security认证流程&#xff0c;我们先得认识与之相关的三个基本组件&#xff1a;AuthenticationMa…

Redis——》事务

推荐链接&#xff1a; 总结——》【Java】 总结——》【Mysql】 总结——》【Spring】 总结——》【SpringBoot】 总结——》【MyBatis、MyBatis-Plus】 Redis——》事务一、概念二、示例multi、execdiscardwatch三、事务发生错误1、入队阶段发生错误2、执…

数据库课程设计——学籍管理系统

目录 1 问题的提出 1 2 需求分析 2 2.1需求描述 2 2.2数据字典 3 2.2.1数据项 3 2.2.2主要的数据流定义 6 2.3数据流图和业务流图 7 2.3.1顶层数据流图 7 2.3.2第一层数据流图 8 2.3.3第一层数据流图 8 2.3.4第一层数据流图 9 2.3.5第一层数据流图 9 3 概念结构设计 10 3.1实…

docker基础命令

docker基础 docker中的三个基本概念: 镜像: Docker 镜像&#xff08;Image&#xff09;&#xff0c;就相当于是一个 root 文件系统 容器: 镜像&#xff08;Image&#xff09;和容器&#xff08;Container&#xff09;的关系&#xff0c;就像是面向对象程序设计中的类和实例一…

基于STM32的DS18B20多点测温系统(Proteus仿真+程序)

编号&#xff1a;22 基于STM32的DS18B20多点测温系统 功能描述&#xff1a; 本设计由STM32F103单片机三路DS18B20温度传感器1602液晶显示模块组成。 1、主控制器是STM32F103单片机 2、三路共用“单总线”DS1820温度传感器测量温度 3、1602液晶显示温度&#xff0c;保留一位小…

[附源码]java毕业设计明光中学考试系统

项目运行 环境配置&#xff1a; Jdk1.8 Tomcat7.0 Mysql HBuilderX&#xff08;Webstorm也行&#xff09; Eclispe&#xff08;IntelliJ IDEA,Eclispe,MyEclispe,Sts都支持&#xff09;。 项目技术&#xff1a; SSM mybatis Maven Vue 等等组成&#xff0c;B/S模式 M…

Meta开源新工具啊,Git地位危险了?

程序员宝藏库&#xff1a;https://gitee.com/sharetech_lee/CS-Books-Store 从事编程开发的同学&#xff0c;绝大多数都会和版本控制系统打交道。 提到版本控制系统&#xff0c;目前比较主流的就是Git和SVN&#xff0c;尤其是Git&#xff0c;使用最为广泛。 关于Git和SVN之间…

python绘制Bubble气泡图pltscatter

python绘制Bubble气泡图pltscatter 先上结果&#xff1a; 基础语法&#xff1a; Axes.scatter(x, y**,** sNone**,** cNone**,** markerNone**,** cmapNone**,** normNone**,** vminNone**,** vmaxNone**,** alphaNone**,** linewidthsNone**,** , edgecolorsNone,* plotnonf…

nVisual 场景搭建所需接口

使用nVisua在创建新的项目步骤是搭建场景、创建对象、创建对象连接&#xff0c;本章小编带大家先了解搭建场景需要的接口。 场景搭建可根据自身项目需要搭建园区、建筑、楼层、机房这几类场景。分别用到了地图场景创建接口、CAD场景创建接口、静态图片背景创建接口。 1.地图场…

企业内训系统源码,为企业量身定制学习平台

如何进行企业内训系统开发&#xff1f;不同的直播平台的功能是不同的&#xff0c;企业的发展与员工的素质、能力、工作人效等不可分割&#xff0c;如何提高员工的工作能力&#xff0c;企业内部培训是离不开的&#xff0c;那么企业内训系统如何开发&#xff1f;怎么做一个企业学…

Spring Cloud面试题

什么是Spring Cloud Spring Cloud是目前最常用的微服务开发框架&#xff08;微服务的特点就是"模块化、功能化"&#xff0c;微服务架构的本质是将原来的整体项目划分成多个功能模块&#xff0c;每个功能模块都可以独立运行提供服务&#xff09;&#xff0c;它利用Sp…

wps和office可以同时装吗?

wps和office是很多用户都在使用的办公软件&#xff0c;那就有小白用户问了一台电脑可以存在wps和office吗&#xff1f;两个软件兼容吗&#xff1f;wps和office性质上都是办公软件&#xff0c;但是并不算重复&#xff0c;因此是可以同时安装的。 wps和office能同时安装吗 答&…

合并多个PDF怎么合并?建议学会这几个合并方法

你们平时工作的时候&#xff0c;看到自己的电脑桌面有很多文档文件&#xff0c;会不会觉得很杂乱&#xff1f;如果不将这些资料好好整理一番&#xff0c;都不能好好完成接下来的工作。其实如果是同种类型的PDF文件&#xff0c;我们可以将它们合并&#xff0c;这样既可以归类&am…

STM32单片机DS18B20测温液晶1602显示例程(Proteus仿真+程序)

编号&#xff1a;21 STM32单片机DS18B20测温液晶1602显示例程 功能描述&#xff1a; 本设计由STM32F103C8T6单片机最小系统DS18B20温度传感器1602液晶显示模块组成。 1、主控制器是STM32F103C8T6单片机 2、DS1820温度传感器测量温度 3、1602液晶显示温度&#xff0c;保留一位…

理解Linux32位机器下虚拟地址到物理地址的转化

文章目录前言一、基本概念介绍二、虚拟地址到物理地址的转化过程总结前言 简要介绍LINUX32位系统下虚拟地址到物理地址的转化过程。 一、基本概念介绍 在32位机器下&#xff0c;IO的基本单位是块&#xff08;块&#xff1a;4kb),在程序编译成可执行程序时也划分好了以4kb为单…

Linux的前世今生

14天学习训练营导师课程&#xff1a; 互联网老辛《 符合学习规律的超详细linux实战快速入门》 努力是为了不平庸~ 学习有些时候是枯燥的&#xff0c;但收获的快乐是加倍的&#xff0c;欢迎记录下你的那些努力时刻&#xff08;学习知识点/题解/项目实操/遇到的bug/等等&#xf…

使用STM32CubeMX实现按下按键,电平反转

需提前学习&#xff1a;使用STM32CubeMX实现LED闪烁 目录 原理图分析 按键部分原理图分析 LED部分原理图分析 STM32CubeMX配置 关于STM32CubeMXSYS的Debug忘记配置Serial Wire处理办法 GPIO配置 LED的GPIO配置 KEY1配置 关于PA0后面这个WKUP是什么&#xff1f; 那么啥…