HTML+CSS+JavaScript网页制作案例教程第2版-黑马程序员-第8章动手实践

HTML+CSS+JavaScript网页制作案例教程第2版-黑马程序员-第8章动手实践

文章目录

  • HTML+CSS+JavaScript网页制作案例教程第2版-黑马程序员-第8章动手实践
    • 效果图
    • 代码
    • 素材

效果图

在这里插入图片描述
在这里插入图片描述

代码

<!doctype html>
<html><head><meta charset="utf-8"><title>风车</title><style type="text/css">* {margin: 0;padding: 0;list-style: none;}div {width: 1024px;height: 606px;position: relative;background: url(./images/bg02.jpg) no-repeat;}.fc {display: inline-block;width: 427px;height: 430px;background: url(./images/fc.png) no-repeat;position: absolute;left: 37%;top: 28%;animation: rotate1 10s linear 0s infinite;/* rotate1 的动画,持续时间为 10 秒,速度曲线为线性(匀速),延迟时间为 0 秒,且无限次循环。 */}
/* 定义一个名为 rotate1 的关键帧动画。从 -360deg 旋转到 0deg,即顺时针旋转一圈。 */@keyframes rotate1 {from {transform: rotate(-360deg);}to {transform: rotate(0);}}</style>
</head><body><div><span class="fc"></span></div>
</body></html>

在这里插入图片描述

素材

自己右键下载保存吧

fc.png
在这里插入图片描述

bg02.jpg
在这里插入图片描述

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

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

相关文章

Linux如何在目录下灵活创建、浏览、删除百万个文件

文章目录 一、创建百万级小文件1、单核CPU情况2、多核CPU情况3、执行效率对比3.1、单核的顺序执行3.2、多核的并发执行 二、如何列出/浏览这些文件1、查看目录下文件的数量2、列出&#xff1f;3、ls -f&#xff08;关闭排序功能&#xff09;3.1、执行效率对比 4、通过重定向导入…

flinkcdc 3.0 源码学习之客户端flink-cdc-cli模块

注意 : 本文章是基于flinkcdc 3.0 版本写的 我们在前面的文章已经提到过,flinkcdc3.0版本分为4层,API接口层,Connect链接层,Composer同步任务构建层,Runtime运行时层,这篇文章会对API接口层进行一个探索.探索一下flink-cdc-cli模块,看看是如何将一个yaml配置文件转换成一个任务…

电子画册制作技巧,从零基础到专业人士

电子画册作为一种新兴的视觉传达形式&#xff0c;正越来越受到大众的喜爱。从设计新手到专业人士&#xff0c;如何快速掌握电子画册的制作技巧&#xff0c;提升自己的创作水平呢&#xff1f; 一、明确设计目的和定位 制作电子画册前&#xff0c;首先要明确其设计目的和定位。画…

数字营销:以大数据作引擎,推动企业全面数字化升级

数字营销本质乃是以大数据为核之心&#xff0c;促使营销活动高效运作&#xff0c;消费者线上线下数据的无缝衔接、企业内外部数据的贯通、公域引流私域运营等&#xff0c;皆已成为企业运营的标准配置。 数据即等同于市场&#xff0c;市场即等同于用户&#xff0c;用户乃是企…

回溯算法之简单组合

哦吼&#xff01;今天结束了二叉树&#xff0c;开始回溯算法 其实也需要用到迭代&#xff0c;哈哈哈哈&#xff0c;但是这个暴力穷举真的好爽。 先记一下回溯算法的基本框架吧 老规矩&#xff1a; 还是有结束条件 但是后面就不太一样了 这里就是for循环&#xff0c;循环n…

Windows下mingw32编译ffmpeg5.1.4实现rtsp拉流

由于客户要求&#xff0c;要在Windows下使用mingw32编译&#xff0c;去ffmpeg.org下载需要编译的版本&#xff0c;使用msys2方法进行编译&#xff0c;使用QT5.10的编译器&#xff0c;基本上把网上的方法试了个遍&#xff0c;编译全部库总是报错出问题 查看了ffbuild文件夹中con…

文件夹类型异常成文件:原因解析与恢复策略

在数字时代&#xff0c;数据的安全与完整性对于个人和企业都至关重要。然而&#xff0c;有时我们可能会遇到一种令人困惑的情况&#xff1a;原本应该是文件夹的图标&#xff0c;却突然变成了文件的图标&#xff0c;这就是所谓的“文件夹类型成文件”问题。本文将深入探讨这一现…

Swagger测试接口,请求头添加token

概述Swagger 1、概述 在日常开发中&#xff0c;我们的业务需要用户登录&#xff0c;权限控制。但是在某些情况下我们使用Swagger测试接口&#xff0c;部分接口需要携带token&#xff0c;才能访问&#xff0c;就需要在swagger添加token窗口。 效果图&#xff1a; 由 右上角 A…

Python计算回归拟合各项指标

0、各项回归指标简介 Relative Root Mean Squared Error&#xff08;RRMSE&#xff09;&#xff1a;The RRMSE normalizes the Root Mean Squared Error (RMSE) by the mean of observations. It goes from 0 to infinity. The lower the better the prediction performance.T…

衍生品赛道的 UniSwap:SynFutures 或将成为行业领军者

经过一个周期的发展&#xff0c;DeFi 已经成为基于区块链构建的最成功的去中心化应用&#xff0c;并彻底改变了加密市场的格局。加密货币交易开始逐步从链下转移到链上&#xff0c;并从最初简单的 Swap 到涵盖借贷、Staking、衍生品交易等广泛的生态系统。 在 DeFi 领域&#x…

从普通神经网络到transformer

1.单隐藏层的多层感知机 2. 循环神经网络 3.现代循环神经网络。 GRU 门控循环单元 LSTM 长短期记忆网络 候选记忆元&#xff1a; ˜C t ∈ R &#xff08;nh&#xff09; 记忆元

超详细的前后端实战项目(Spring系列加上vue3)前后端篇(四)(一步步实现+源码)

兄弟们&#xff0c;继昨天的代码之后&#xff0c;继续完成最后的用户模块开发&#xff0c; 昨天已经完成了关于用户的信息编辑页面这些&#xff0c;今天再完善一下&#xff0c; 从后端这边开始吧&#xff0c;做一个拦截器&#xff0c;对用户做身份校验&#xff0c; 拦截器 这…

OrangePi AIpro 性能测试以及使用体验

OrangePi AIpro 性能测试以及使用体验 1. 介绍 OrangePi AIpro(8T)采用昇腾AI技术路线。 具体为4核64位处理器AI处理器&#xff0c;集成图形处理器&#xff0c;支持8TOPS AI算力拥有8GB/16GB LPDDR4X&#xff0c;可以外接32GB/64GB/128GB/256GB eMMC模块&#xff0c;支持双4…

输出相关命令

什么是输入输出重定向&#xff0c;就是用另外一个位置来代替它&#xff0c;默认输入为键盘&#xff0c;默认输出为终端窗口 管道能把一系列的命令连起来&#xff0c;&#xff5c;为命令符 cat file 历史查询 history 回车可以查到用过的命令。上下左右键可以回到之前命令或…

记mapboxGL实现鼠标经过高亮时的一个问题

概述 mapboxGL实现鼠标经过高亮可通过注册图层的mousemove和moveout事件来实现&#xff0c;在mousemove事件中可以拿到当前经过的要素&#xff0c;但是当使用该要素时&#xff0c;发现在某个地图级别下会有线和面数据展示不全的情况。究其原因&#xff0c;发现是mapboxGL在绘图…

【多线程】线程安全

目录 1.观察线程不安全 2.线程不安全的原因 2.1 随机调度 2.2 修改共享数据 2.3 原子性 2.4 内存可见性 2.5 指令重排序 3.synchronized 加锁操作 3.1 synchronized是什么&#xff1f; 3.2 synchronized的特性 1) 互斥 2) 可重入 3.3 synchronized使用示例 3.3.1 针…

“二叉堆:不是,啊?”

目录 前言一、堆的概念及结构堆的性质&#xff1a;堆的结构:最大堆最小堆堆顶注意 二、堆的实现1.初始化堆2. 堆的插入什么是堆的向上调整算法&#xff1f; 3.堆的删除什么是堆的向下调整算法&#xff1f; 4.获取堆顶的数据5.获取堆的数据个数6.堆的判空7.堆的销毁 三、建堆的时…

【ES6】ECMAS6新特性概览(一):变量声明let与const、箭头函数、模板字面量全面解析

&#x1f525; 个人主页&#xff1a;空白诗 &#x1f525; 热门专栏&#xff1a;【JavaScript】 文章目录 &#x1f33f; 引言一、 let 和 const - 变量声明的新方式 &#x1f31f;&#x1f4cc; var的问题回顾&#x1f4cc; let的革新&#x1f4cc; const的不变之美 二、 Arro…

第六十六节 Java设计模式 -责任链模式

Java设计模式 -责任链模式 责任链模式为请求创建一个接收者对象列表。 这种模式是行为模式。 当使用责任链模式时&#xff0c;通常每个接收器包含对另一个接收器的引用。 如果一个对象不能处理请求&#xff0c;则它将相同的对象传递给下一个接收者&#xff0c;等等。 例子 …

删除edge浏览器文本框储存记录值以及关闭自动填充

当我们点击输入框时总会出现许多以前输入过的信息。 一、删除edge浏览器文本框储存记录值 1、首先按下↓键选中你想删除的信息 二、关闭自动填充。 1、在地址栏输入edge://wallet/settings跳转到以下界面 2、往下滑找到 全部取消即可