当前位置： 首页 > news >正文

用html写一个爱心

news 2025/7/9 0:03:42

在这里插入图片描述

<!DOCTYPE html>
<html lang="zh-CN"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /><title>爱您</title><style>* {padding: 0;margin: 0;}body {background-color: pink;}#frame {position: relative;width: 400px;height: 300px;margin: 200px auto;}.left,.right {top: 0;width: 200px;height: 200px;border-radius: 50%;}.left {left: 35px;}.right {right: 35px;z-index: -1;}.bottom {bottom: 36px;left: 100px;width: 200px;height: 200px;transform: rotate(45deg);z-index: -1;}.heart {position: absolute;box-shadow: 0 0 40px #d5093c;animation: beat 0.8s ease infinite normal;background: linear-gradient(-90deg, #f50a45 0%, #d5093c 40%);}@keyframes beat {0% {transform: scale(1) rotate(225deg);box-shadow: 0 0 40px #d5093c;}50% {transform: scale(1.1) rotate(225deg);box-shadow: 0 0 70px #d5093c;}100% {transform: scale(1) rotate(225deg);box-shadow: 0 0 40px #d5093c;}}@keyframes a {0% {transform: scale(1) rotate(0deg);}50% {transform: scale(1.1) rotate(0deg);}100% {transform: scale(1) rotate(0deg);}}#z {width: 90px;margin: -23% 30%;position: absolute;animation: a 0.8s ease infinite normal;}#w {width: 90px;margin: -23% 67%;position: absolute;animation: a 0.8s ease infinite normal;}#con {width: 20px;margin: -7% 49.5%;position: absolute;animation: a 0.8s ease infinite normal;}</style></head><body><div id="frame"><div class="heart left"></div><div class="heart right"></div><div class="heart bottom"></div></div><div id="z"><h2>胡歌</h2></div><div id="w"><h2>未知</h2></div><!-- <div id="con"><h1>字里行间，全都是你。</h1></div> --><script type="text/javascript">var btn = document.getElementById('frame')//   双击事件btn.ondblclick = function () {// window.location.href = 'http://www.kim-shift.cn'window.open('http://www.kim-shift.cn')}</script></body>
</html>

相关文章：

用html写一个爱心

<!DOCTYPE html> <html lang"zh-CN"><head><meta http-equiv"Content-Type" content"text/html; charsetUTF-8" /><title>爱您</title><style>* {padding: 0;margin: 0;}body {background-color: pin…...

编程日记 2024/4/6 2:06:02

如何看到 synchronized 背后的“monitor 锁”？

Java全能学习+面试指南：https://javaxiaobear.cn 获取和释放 monitor 锁的时机 我们都知道，最简单的同步方式就是利用 synchronized 关键字来修饰代码块或者修饰一个方法，那么这部分被保护的代码，在同一时刻就最多只有一个线程可以运行，而 synchronized 的背后正是利用 …...

编程日记 2024/4/6 2:03:00

如何建立一个网页模版

创建一个网页模板涉及的主要步骤如下： 基本HTML结构模板创建： 创建HTML文件： 首先，你需要创建一个新的HTML文件，并在其中编写基本的HTML结构，例如： <!DOCTYPE html> <html lang="zh"> <head><meta charset="UTF-8"...

编程日记 2024/4/6 2:01:58

P8783 [蓝桥杯 2022 省 B] 统计子矩阵

题目:P8783 [蓝桥杯 2022 省 B] 统计子矩阵 - 洛谷 | 计算机科学教育新生态 (luogu.com.cn) 代码&#xff1a;&#xff08;部分解析在代码中&#xff09; #include<bits/stdc.h> using namespace std; long long a[1010][1010]; long long pre[1010][1010]; long long …...

编程日记 2024/4/6 1:59:56

【C++】list介绍

个人主页 &#xff1a; zxctscl 如有转载请先通知 文章目录 1. list介绍2. list的构造3. ist iterator的使用4. capacity5. element access6. modifiers7. 迭代器失效8. Operations8.1 reverse8.2 sort8.3 unique8.4 splice 1. list介绍 list是可以在常数范围内在任意位置进行插…...

编程日记 2024/4/6 1:58:54

【SQL Server】2. 将数据导入导出到Excel表格当中

最开始&#xff0c;博主介绍一下自己的环境&#xff1a;SQL Sever 2008 R2 SQL Sever 大致都差不多 1. 通过自带软件的方式 首先找到下载SQL Sever中提供的导入导出工具 如果开始界面没有找到自己下载的路径 C:\Program Files\Microsoft SQL Server\100\DTS\Binn下的DTSWiz…...

编程日记 2024/4/6 1:57:54

基于JAVA+SSM+VUE的前后端分离的大学竞赛管理系统

一、项目背景介绍&#xff1a; 随着互联网技术的快速发展&#xff0c;大学竞赛管理系统已经成为了各个高校组织和管理各类学术竞赛的重要工具。传统的大学竞赛管理系统往往采用前后端混合的开发模式&#xff0c;导致系统的性能和可维护性受到限制。为了提高系统的开发效率和用户…...

编程日记 2024/4/6 1:54:51

音频转换工具 Bigasoft FLAC Converter for Mac

Bigasoft FLAC Converter for Mac是一款专为Mac用户设计的音频转换工具&#xff0c;它能够将FLAC音频文件高效、高质量地转换为其他常见的音频格式&#xff0c;如MP3、AAC等。这款软件具有直观易用的界面&#xff0c;使用户能够轻松上手&#xff0c;无需复杂的操作步骤即可完成…...

编程日记 2024/4/6 1:53:49

洛谷 P4554 小明的游戏

思路&#xff1a;双端队列。 其实一开始你可以用BFS进行实验&#xff0c;由于我们需要找最小的费用&#xff0c;所以我们在BFS的时候可以这样想&#xff1a;在我们遍历到第一块板子的时候&#xff0c;在找周围的路时&#xff0c;我们可以改成这样的判断&#xff1a;如果周围的…...

编程日记 2024/4/6 1:49:44

序列化案例实操（统计每一个手机号耗费的总上行流量、总下行流量、总流量）

文章目录 序列化概述自定义bean对象实现序列化接口&#xff08;Writable&#xff09;案例需求编写MapReduce程序运行结果 序列化概述 序列化就是把内存中的对象&#xff0c;转换成字节序列&#xff08;或其他数据传输协议&#xff09;以便于存储到磁盘&#xff08;持久化&…...

编程日记 2024/4/6 1:48:43

使用 LLMLingua-2 压缩 GPT-4 和 Claude 提示

原文地址&#xff1a;Compress GPT-4 and Claude prompts with LLMLingua-2 2024 年 4 月 1 日 向大型语言模型&#xff08;LLM&#xff09;发送的提示长度越短&#xff0c;推理速度就会越快&#xff0c;成本也会越低。因此&#xff0c;提示压缩已经成为LLM研究的热门领域。 …...

编程日记 2024/4/6 1:46:41

编程大牛坚持了 10 年的 10 个编程好习惯

目录 1.多看官方文档 2.面向搜索引擎编程 3.规范命名 4.认真注释 5.不要重复造轮子 6.多读多写代码 7.预留开发时间 8.大胆重构 9.师傅领进门 10.多阅读源码 1.多看官方文档 不要被这几个字吓到&#xff0c;官方文档其实都是宝藏。 一个成熟的技术诞生&#xff0c;…...

编程日记 2024/4/6 1:45:40

QEMU上PAC功能验证与异常解析

PAC功能如何验证&#xff1f;PAC检查失败时发生什么&#xff1f;问题如何定位&#xff1f;本博客主要探讨这些问题。...

编程日记 2024/4/6 1:44:39

简约轻量-失信录系统源码

失信录系统-最新骗子收录查询系统源码 首页查询&#xff1a; 举报收录页&#xff1a; 后台管理页&#xff1a; 失信录系统 V1.0.0 更新内容&#xff1a; 1.用户查询,举报功能 2.界面独立开发 3.拥有后台管理功能 4.xss,sql安全过滤 5.平台用户查询 6.用户中心&#xff08;待完…...

编程日记 2024/4/6 1:43:38

前端入门系列-HTML-HTML常见标签（注释，标题，段落，换行）

&#x1f308;个人主页&#xff1a;羽晨同学 &#x1f4ab;个人格言:“成为自己未来的主人~” HTML常见标签 注释标签 注释不会显示在界面上&#xff0c;目的是提高代码的可读性 <!---这是一个注释----> 注释的原则 要和代码逻辑一致尽量使用中文不要传递负能量 …...

编程日记 2024/4/6 1:41:35

【mysql 第3-10条记录怎么查】

mysql 第3-10条记录怎么查 在MySQL中&#xff0c;如果你想要查询第3到第10条记录&#xff0c;你通常会使用LIMIT和OFFSET子句。但是&#xff0c;需要注意的是&#xff0c;LIMIT和OFFSET是基于结果集的行数来工作的&#xff0c;而不是基于记录的物理位置。这意味着它们通常与某种…...

编程日记 2024/4/6 1:39:32

1.Git是用来干嘛的

本文章学习于【GeekHour】一小时Git教程&#xff0c;来自bilibili Git就是一个文件管理系统&#xff0c;这样说吧&#xff0c;当多个人同时在操作一个文件的同时&#xff0c;很容易造成紊乱&#xff0c;git就是保证文件不紊乱产生的 包括集中式管理系统和分布式管理系统 听懂…...

编程日记 2024/4/6 1:36:29

Git安装教程（图文安装）

Git Bash是git(版本管理器)中提供的一个命令行工具&#xff0c;外观类似于Windows系统内置的cmd命令行工具。 可以将Git Bash看作是一个终端模拟器&#xff0c;它提供了类似于Linux和Unix系统下Bash Shell环境的功能。通过Git Bash&#xff0c;用户可以在Windows系统中运行基于…...

编程日记 2024/4/6 1:35:28

SpringData ElasticSearch - 简化开发，完美适配 Spring 生态

目录 一、SpringData ElasticSearch 1.1、环境配置 1.2、创建实体类 1.3、ElasticsearchRestTemplate 的使用 1.3.1、创建索引 设置映射 1.3.2、创建索引映射注意事项&#xff08;必看&#xff09; 1.3.3、简单的增删改查 1.3.4、搜索 1.4、ElasticsearchRepository …...

编程日记 2024/4/6 1:26:21

突破！AI机器人拥有嗅觉！仿生嗅觉芯片研究登上Nature子刊

我们一直梦想着让AI与人类能够更加相似&#xff0c;赋予它们视觉与听觉。而让机器人拥有嗅觉一直以来面临着巨大的困难。 香港科技大学范志勇教授领导的研究团队凭借最新研发的仿生嗅觉芯片&#xff08;BOC&#xff09;在这一领域取得了重大突破。该研究成果目前已被发表到IF …...

编程日记 2024/4/6 1:25:20

OpenLayers 可视化之热力图

注&#xff1a;当前使用的是 ol 5.3.0 版本&#xff0c;天地图使用的key请到天地图官网申请&#xff0c;并替换为自己的key 热力图&#xff08;Heatmap&#xff09;又叫热点图&#xff0c;是一种通过特殊高亮显示事物密度分布、变化趋势的数据可视化技术。采用颜色的深浅来显示…...

编程新知 2025/7/6 21:38:30

Qt Http Server模块功能及架构

Qt Http Server 是 Qt 6.0 中引入的一个新模块&#xff0c;它提供了一个轻量级的 HTTP 服务器实现&#xff0c;主要用于构建基于 HTTP 的应用程序和服务。 功能介绍&#xff1a; 主要功能 HTTP服务器功能&#xff1a; 支持 HTTP/1.1 协议 简单的请求/响应处理模型 支持 GET…...

编程新知 2025/6/16 12:49:42

iOS性能调优实战：借助克魔(KeyMob)与常用工具深度洞察App瓶颈

在日常iOS开发过程中&#xff0c;性能问题往往是最令人头疼的一类Bug。尤其是在App上线前的压测阶段或是处理用户反馈的高发期&#xff0c;开发者往往需要面对卡顿、崩溃、能耗异常、日志混乱等一系列问题。这些问题表面上看似偶发&#xff0c;但背后往往隐藏着系统资源调度不当…...

编程新知 2025/6/19 5:23:30

音视频——I2S 协议详解

I2S 协议详解 I2S (Inter-IC Sound) 协议是一种串行总线协议&#xff0c;专门用于在数字音频设备之间传输数字音频数据。它由飞利浦&#xff08;Philips&#xff09;公司开发&#xff0c;以其简单、高效和广泛的兼容性而闻名。 1. 信号线 I2S 协议通常使用三根或四根信号线&a…...

编程新知 2025/6/15 23:06:39

MySQL JOIN 表过多的优化思路

当 MySQL 查询涉及大量表 JOIN 时&#xff0c;性能会显著下降。以下是优化思路和简易实现方法&#xff1a; 一、核心优化思路 减少 JOIN 数量 数据冗余&#xff1a;添加必要的冗余字段&#xff08;如订单表直接存储用户名&#xff09;合并表&#xff1a;将频繁关联的小表合并成…...

编程新知 2025/7/6 1:12:52

MySQL 索引底层结构揭秘：B-Tree 与 B+Tree 的区别与应用

文章目录 一、背景知识&#xff1a;什么是 B-Tree 和 BTree&#xff1f; B-Tree&#xff08;平衡多路查找树&#xff09; BTree&#xff08;B-Tree 的变种&#xff09; 二、结构对比&#xff1a;一张图看懂 三、为什么 MySQL InnoDB 选择 BTree&#xff1f; 1. 范围查询更快 2…...

编程新知 2025/7/8 23:35:15

嵌入式常见 CPU 架构

架构类型架构厂商芯片厂商典型芯片特点与应用场景PICRISC (8/16 位)MicrochipMicrochipPIC16F877A、PIC18F4550简化指令集&#xff0c;单周期执行&#xff1b;低功耗、CIP 独立外设&#xff1b;用于家电、小电机控制、安防面板等嵌入式场景8051CISC (8 位)Intel&#xff08;原始…...

编程新知 2025/6/10 21:24:01

学习一下用鸿蒙​​DevEco Studio HarmonyOS5实现百度地图

在鸿蒙&#xff08;HarmonyOS5&#xff09;中集成百度地图&#xff0c;可以通过以下步骤和技术方案实现。结合鸿蒙的分布式能力和百度地图的API&#xff0c;可以构建跨设备的定位、导航和地图展示功能。 ​​1. 鸿蒙环境准备​​ ​​开发工具​​&#xff1a;下载安装 ​​De…...

编程新知 2025/7/8 22:51:18

Elastic 获得 AWS 教育 ISV 合作伙伴资质，进一步增强教育解决方案产品组合

作者&#xff1a;来自 Elastic Udayasimha Theepireddy (Uday), Brian Bergholm, Marianna Jonsdottir 通过搜索 AI 和云创新推动教育领域的数字化转型。 我们非常高兴地宣布&#xff0c;Elastic 已获得 AWS 教育 ISV 合作伙伴资质。这一重要认证表明&#xff0c;Elastic 作为 …...

编程新知 2025/7/8 21:13:02

在golang中如何将已安装的依赖降级处理，比如：将 go-ansible/v2@v2.2.0 更换为 go-ansible/@v1.1.7

在 Go 项目中降级 go-ansible 从 v2.2.0 到 v1.1.7 具体步骤&#xff1a; 第一步&#xff1a; 修改 go.mod 文件 // 原 v2 版本声明 require github.com/apenella/go-ansible/v2 v2.2.0 替换为&#xff1a; // 改为 v…...

编程新知 2025/7/8 21:05:42