赠品:跳动的心

下面是一段html代码,你可以把它在浏览器中显示一下,有点意思。

<!DOCTYPE html>
<html lang="en" encoding="utf-8">
<head>
    <meta charset="UTF-8">
    <title>Titlexinxing</title>
    <style>
      body{
        background-color:#ffa5a5;
      }
      .cen{
        width: 200px;
        height: 200px;
        background-color: red;
        box-shadow:0px 0px 80px red;
        animation:0.6s ad infinite;
      }
      .left{
        border-radius:100px;
        position:absolute;
        top:200px;
        left:200px;
      }
      .rig{
        border-radius: 100px;
        position:absolute;
        top:200px;
        left:341px;
      }
      .c{
        transform: rotate(45deg);
        position:absolute;
        top: 269px;
        left: 271px;
      }
      @keyframes ad{
        0%{transform:scale(1)rotate(45deg);}
        50%{transform:scale(1.1)rotate(45deg);}
        100%{transform:scale(1)rotate(45deg);}

      }

      div:hover{
        transform:scale(1.3);
        transform:translate(0px,-5px);
        transform:skew()
      }
    </style>
</head>
<body>
    <div class="cen left"></div>
    <div class="cen c"></div>
    <div class="cen rig"></div>
</body>
</html>

运行之前,需要调整一下嵌套格式。

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

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

相关文章

深度 | 践行绿色健康可持续发展,这家企业提供了价值范本

文 | 螳螂观察 作者 | 余一 近段时间以来&#xff0c;小米SU7热度一直不减&#xff0c;在展露小米强大品牌号召力的同时&#xff0c;也侧面体现出了当前消费者对于新能源汽车的喜爱。 而消费者选择新能源汽车时&#xff0c;环保因素也起到了至关重要的作用。像前几日&#x…

数据结构-上三角矩阵存储方式[0知识掌握]

目标&#xff1a;看完本文章你将会了解上三角矩阵的存储方式以及矩阵中数据的位置索引号如何求 难点&#xff1a;上三角矩阵的公式推导&#xff0c;上三角任意位置对应的存储位置。 一、准备知识 1.求和公式 前n项和&#xff1a;Sn n(a1an)/2 公差&#xff1a;d后项-前项…

SASS 目录结构

SASS 目录结构的管理 对于大型项目来说&#xff0c;前端的页面很多&#xff0c;如果不能很好的管理 SASS 的目录结构或者架构&#xff0c;后续的维护可能会非常困难。SASS 7-1 是官方的一个最佳实践&#xff0c;就是将 SASS 文件按照不同的类别放入不同目录中&#xff0c;包括…

【JavaEE多线程】线程安全、锁机制及线程间通信

目录 线程安全线程安全问题的原因 synchronized 关键字-监视器锁monitor locksynchronized的特性互斥刷新内存可重入 synchronized使用范例 volatilevolatile能保证内存可见性volatile不保证原子性synchronized 也能保证内存可见性 wait 和 notifywait()方法notify()方法notify…

开发语言漫谈-JavaScript

JavaScript、Java名字很相近&#xff0c;但它们没有任何亲缘关系&#xff0c;是由不同公司开发的编程语言。Java由Sun公司&#xff08;后被Oracle收购&#xff09;开发&#xff0c;JavaScript最初是由Netscape公司开发的&#xff08;当年浏览器的霸主&#xff09;。JavaScrip…

PostgreSQL恢复系列:pg_filedump恢复字典构造---惜分飞

pg_filedump是在pg数据库极端情况下直接解析数据库文件的利器,但是由于是开源软件,本身难以实现批量处理,通过对底层基表分析,可以实现批量处理功能分析PostgreSQL库中数据库信息 --数据库查询结果 postgres# select oid,datname,datdba,dattablespace from pg_database; oid…

leetcode--3 无重复最长字串

题目描述 给定一个字符串 s &#xff0c;请你找出其中不含有重复字符的 最长 子串 的长度。 示例 1: 输入: s "abcabcbb" 输出: 3 解释: 因为无重复字符的最长子串是 "abc"&#xff0c;所以其长度为 3。示例 2: 输入: s "bbbbb" 输出: 1 …

PyTorch torch.nn.functional.one_hot用法解析

1.用法 在PyTorch中&#xff0c;我们可以使用torch.nn.functional.one_hot函数来实现One-Hot编码。下面是一个简单的例子&#xff1a; import torch import torch.nn.functional as F # 假设我们有一个包含类别标签的张量 labels torch.tensor([0, 2, 1, 0, 2]) # 使用torch…

深度学习概念

AIGC数据生产&#xff1a; AIGC在生成小图片时效果更佳(因为小图信息量更少&#xff0c;相同算力下效果更好)&#xff1b;所以适合构造一些交通场景。比如护栏损坏&#xff1a;只mask原图的部分区域(图中白色区域)&#xff0c;即可引导模型在mask处生成损坏的护栏。 基于此方…

【LeetCode热题100】【动态规划】完全平方数

题目链接&#xff1a;279. 完全平方数 - 力扣&#xff08;LeetCode&#xff09; 完全平方数是可以表示成某个整数的平方的数&#xff0c;要找和为n的完全平方数的最少数目 满足要求的完全平方数最小是1&#xff0c;最大不会超过n的平方根 所以题目变成要从1&#xff0c;2&am…

【LeetCode热题100】【动态规划】最长递增子序列

题目链接&#xff1a;300. 最长递增子序列 - 力扣&#xff08;LeetCode&#xff09; 让dp[i]是以nums[i]为结尾的子序列的最长递增长度&#xff0c;遍历nums[i]之前的元素&#xff0c;如果有比nums[i]小的&#xff0c;说明递增子序列可以延申 class Solution { public:int le…

拖拽式工作流有哪几个优势?

在信息技术迅猛发展的今天&#xff0c;如何助力中小型企业在数字化转型的过程中平稳过渡&#xff1f;又是如何让中小型企业摆脱数据孤岛、成本投入高等各种瓶颈和难题&#xff1f;低代码技术平台是近些年较为理想的平台产品&#xff0c;其中拖拽式工作流优势特点突出&#xff0…

地埋电缆故障检测方法有哪些?地埋电缆故障检测费用是多少?

地埋电缆故障检测方法主要涵盖脉冲反射法、桥接法、高压闪络法和声波定位法等多种方法。选择适当的方法取决于故障类型、电缆类型和实际现场条件。至于地埋电缆故障检测费用则受到多个因素的影响&#xff0c;包括故障类型、检测方法的复杂性、检测设备的先进程度以及所处地区的…

从零开始搭建社交圈子系统:充实人脉的最佳路径

线上交友圈&#xff1a;拓展社交网络的新时代 线上交友圈是社交网络的新引擎&#xff0c;提供了更广泛的社交机会&#xff0c;注重共同兴趣的连接&#xff0c;强调多样性的社交形式&#xff0c;更真实地展示自己&#xff0c;让朋友更全面地了解我们的生活状态。虽然虚拟交往存在…

SD-WAN解决电商企业海外业务网络难题

全球化背景下&#xff0c;众多国内企业都涉及到海外贸易业务&#xff0c;尤其是出海电商得到蓬勃发展。企业做出海电商&#xff0c;需要访问国外网页、社交平台&#xff0c;如亚马逊、TikTok、Facebook、YouTube等与客户沟通互动&#xff0c;SD-WAN的发展正好为解决国际网络访问…

时序分析相关考题汇总

时序分析例题_如下一个分频电路,触发器建立时间tsu 2ns,保持时间thold 2ns,逻辑延时tq -CSDN博客 IC/FPGA笔试/面试题分析&#xff08;七&#xff09;建立时间和保持时间类型考题汇总分析_建立时间 保持时间 笔试题-CSDN博客

Qt(十二)Graphics View 绘图架构(三)

文章目录 一、QGraphicsView相关整理二、QGraphicsView架构下实时鼠标绘制图形2.1 鼠标拖拽绘图说明2.2 记录图形第一个绘制点2.3 实时获取鼠标最新位置并绘图2.4 释放绘制点&#xff0c;绘制最终图形 三、QGraphicsView 在鼠标点击处进行放大缩小 一、QGraphicsView相关整理 …

14 Php学习:表单

表单 PHP 表单是用于收集用户输入的工具&#xff0c;通常用于网站开发。PHP 可以与 HTML 表单一起使用&#xff0c;用于处理用户提交的数据。通过 PHP 表单&#xff0c;您可以创建各种类型的表单&#xff0c;包括文本输入框、复选框、下拉菜单等&#xff0c;以便用户可以填写和…

孩子不爱学习的解决办法?最佳回答

孩子说不想上学了&#xff0c;想必这句话很多父母都不陌生&#xff0c;从自家孩子嘴里听到过。孩子十三岁了&#xff0c;正是叛逆的时候&#xff0c;很多孩子会在这个时候出现不爱读书的情况&#xff0c;面对这样的情况&#xff0c;家长要保持冷静&#xff0c;采取合理的解决办…

主存储器与CPU之间的连接(会画图)

位扩展 字扩展 由于只有A13&#xff0c; A14 连到了译码器上&#xff0c;以、因此该译码器是一个 2/4 译码器&#xff0c;对应的选片有四种。选中第一个选片&#xff0c;就是把译码器“0口置0&#xff0c; 1~3口置1”&#xff0c;因为CS有非号&#xff0c;因此&#xff0c;低电…