基于html+css的图展示117

news2024/11/28 11:33:31

准备项目

项目开发工具

Visual Studio Code 1.44.2
版本: 1.44.2
提交: ff915844119ce9485abfe8aa9076ec76b5300ddd
日期: 2020-04-16T16:36:23.138Z
Electron: 7.1.11
Chrome: 78.0.3904.130
Node.js: 12.8.1
V8: 7.8.279.23-electron.0
OS: Windows_NT x64 10.0.19044

项目结构

在这里插入图片描述

index.html代码如下

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

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>图片上下移动</title>
    <style>
        img {
            animation: up .5s infinite;
        }

        @keyframes up {
            to {
                margin-top: 200px;
            }
        }
    </style>
</head>

<body>

    <img src="./images/1.jpg" alt="">
</body>

</html>

总结

此代码可以实现图片的无限重复向下移动展示效果,能够让让图片有动态的效果,基于html+css的图展示117。

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

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

相关文章

Java 八股文-集合框架篇

Java 集合框架 一、常见集合 1.说说有哪些常见集合&#xff1f; 集合相关类和接口都在java.util中&#xff0c;主要分为3种&#xff1a;List&#xff08;列表&#xff09;、Map&#xff08;映射&#xff09;、Set(集)。 其中Collection是集合List、Set的父接口&#xff0c…

AI热度降温?揭秘加德纳技术成熟度曲线与AI发展阶段

一文解决你所有对 AI 的焦虑 近期&#xff0c;我们发现ChatGPT的热度似乎不如前几个月。许多人尝试了这个技术&#xff0c;觉得它非常强大&#xff0c;但似乎与自己的日常生活和工作关系不大&#xff0c;因此逐渐失去了兴趣。 然而&#xff0c;这实际上是技术发展的正常周期&…

学术界用ChatGPT写论文,真的靠谱吗?

写论文时&#xff0c;赵铭用ChatGPT查询了国内外云计算技术的研究进展&#xff0c;并请它一一详细介绍。他用搜索引擎简单核实了真实性&#xff0c;润色后就放进了论文中&#xff0c;“我感觉它说的东西都是一些现状&#xff0c;也没什么好调整的&#xff0c;就直接用了&#x…

传感器-陀螺仪芯片

https://www.cnblogs.com/tomatokely/p/16392997.html 陀螺仪芯片厂家&#xff1a; ST ICM42605, MPU 6050, Murata SCL3300/3400 陀螺仪可选量程&#xff1a; 15.6/31.2/62.5/125/250/500/1000/2000 dps 加速度可选量程&#xff1a; 2/4/8/16 g 计算单位&#xff1a; 陀…

vue安裝及配置 nodejs安装配置

vue安装及配置 vue安装步骤 nodejs安装 安装nodejs环境&#xff1a;https://nodejs.org/en/ 查看node版本&#xff1a;node-v vue3.0需要使用node 8版本以上 npm镜像配置 npm是nodejs内置的资源管理器 npm两个镜像&#xff1a; 淘宝镜像&#xff1a;https://registry.npm.…

Mars3d的PolygonEntity的边框宽度outlineWidth只能是1

1.Mars3d的PolygonEntity的边框宽度只能是1 2.问题来源&#xff1a; 尝试在Mars3d官网的面的示例中修改高亮样式是&#xff0c;发现修改边框宽度为3或者是10&#xff0c;效果一致 function addDemoGraphic4(graphicLayer) { const graphic new mars3d.graphic.PolygonEntit…

车载以太网网络管理之UDPNM

前言 首先&#xff0c;请问大家几个小小问题&#xff0c;你清楚&#xff1a; 你知道UdpNm模块的主要作用是什么吗&#xff1f;UdpNm模块与其他AUTOSAR基础软件模块交互关系&#xff1b;UdpNm模块的网络管理算法&#xff0c;状态机如何运转&#xff1f;UdpNm模块的PNC功能如何…

TLE4250-2G-ASEMI代理英飞凌汽车芯片TLE4250-2G

编辑&#xff1a;ll TLE4250-2G-ASEMI代理英飞凌汽车芯片TLE4250-2G 型号&#xff1a;TLE4250-2G 品牌&#xff1a;Infineon(英飞凌) 封装&#xff1a;SCT-595-5 特性&#xff1a;驱动芯片、汽车芯片 温度范围-40C~150C 最大输入电压&#xff1a;-42 V~45 V TLE4250-2G…

跨境电商app系统开发

近年来&#xff0c;随着跨境电商行业的发展&#xff0c;越来越多的企业开始关注跨境电商app系统的开发。这些系统可以帮助企业更加高效地管理跨境电商业务&#xff0c;提高产品销售的效率&#xff0c;并且为消费者提供更加方便快捷的购物体验。 跨境电商app系统的开发需要考虑…

品牌618如何宣传,才能为业绩加油助力?

传媒如春雨&#xff0c;润物细无声&#xff0c;大家好&#xff0c;我是51媒体 胡老师。 随着618年中消费季的临近&#xff0c;许多企业和品牌都已经卯足了马力&#xff0c;争取在年终狂欢中多多增加公司业绩&#xff0c;现在的618 不仅仅涉及我们的吃穿用行&#xff0c;而且各…

计算机网络开荒2.2-Socket编程

文章目录 一、Socket概述二、Socket API 概述三、WinSock常用API3.1 常用API3.1.1 WSAStartUP3.1.2 WSACleanup3.1.3 Socket3.1.4 Closesocket3.1.5 bind3.1.6 listen3.1.7 connect3.1.8 accept3.1.9 send, sendto3.1.10 recv, recvfrom3.1.11 etsockopt, getsockopt 3.2 网络字…

H3C 交换机的VXLAN二层转发配置

H3C 交换机的VXLAN二层转发配置 本篇介绍H3C交换机的VXLAN二层转发配置。 基本概念: 首先了解VXLAN&#xff08;Virtual eXtensible LAN&#xff0c;可扩展虚拟局域网络&#xff09;的基本概念。VXLAN是基于IP网络、采用“MAC in UDP”封装形式的二层VPN技术。VXLAN可以基于…

Vue.js 中的 v-bind 指令详解

Vue.js 中的 v-bind 指令 介绍 Vue.js中的v-bind指令是一种将组件的属性绑定到Vue实例的数据的方式。v-bind指令可以用于将任何组件属性绑定到Vue实例的数据上&#xff0c;例如class、style、属性等。v-bind指令允许我们动态地设置组件的属性&#xff0c;从而使组件更加灵活和…

案例精述丨Fortinet SASE 护航跨国公司中国区网络安全升级

在全球数字化转型大潮下&#xff0c;跨国公司的机构、设施、人员等全球分布式特性&#xff0c;不但带来了广域网建设的网络复杂性&#xff0c;也带来了更加严峻的安全挑战。某全球知名跨国公司&#xff0c;在中国区进行网络安全升级改造的过程中&#xff0c;采用国内某IDC运营商…

阿里巴巴序列模型梳理

SIM&#xff1a;基于搜索的用户终身行为序列建模 论文&#xff1a;《Search-based User Interest Modeling with Lifelong Sequential Behavior Data for Click-Through Rate Prediction》 下载地址&#xff1a;https://arxiv.org/abs/2006.05639 1、用户行为序列建模回顾 1…

JDK8-1-Lambda表达式(3)-函数式接口

JDK8-1-Lambda表达式&#xff08;3&#xff09;-函数式接口 有且仅有一个抽象方法的接口称为函数式接口&#xff0c;上文 中 java.util.function.Predicate 接口就是一个函数式接口&#xff0c;Java 8中引入的函数式接口定义在 java.util.function 包下 java.util.function.P…

【PWN · ret2text 格式化字符串漏洞 | NX | Canary | PIE】[深育杯 2021]find_flag

这一题最终的攻击手段可以是简单的ret2text&#xff08;后门函数给出&#xff09;&#xff0c;然而保护全开则确实让人汗颜。。。 更重要的是&#xff01;docker的程序偏移和本地不一样&#xff01;&#xff01;NSSCTF题目有问题&#xff01;&#xff01; 目录 前言 一、题目…

openEuler22+GreatSQL+dbops玩转MGR

芬达&#xff0c;《芬达的数据库学习笔记》公众号作者&#xff0c;开源爱好者&#xff0c;擅长 MySQL、ansible。 背景 openEuler 是什么 openEuler22.03 LTS 是 openEuler 社区于 2022 年 3 月发布的开源操作系统&#xff08;从系统版本的命名不难发现吧&#xff09;。openE…

apktool for mac

安装步骤 1、Apktool下载 安装apktool Apktool下载 macOS: Download Mac wrapper script (Right click, Save Link As apktool)Download apktool-2 (find newest here)Rename downloaded jar to apktool.jarMove both files (apktool.jar & apktool) to /usr/local/bin …

sqoop系列:sqoop(离线数据同步)开发案例

目录 Apache Hadoop生态-目录汇总-持续更新 1&#xff1a;Mysql(RDBMS)与Hive/HDFS数据传输 1.1&#xff1a;列出MySQL数据有哪些数据库&#xff1a; 1.2&#xff1a;根据mysql表结构创建hive表 1.3: RDBMS导入到hdfs &#xff08;1&#xff09;条件导入 &#xff08;2&…