【Html】Html+Less实现一个简单的加载动画

news2024/12/22 17:56:38

效果

在这里插入图片描述

运行环境

  • 系统：Win10系统
  • IDE：Visual Studio Code v1.79.2
  • VSCode插件：Easy LESS v2.0.0

index.html代码

<!DOCTYPE html>
<html>
    <head>
        <title>加载动画</title>
        <link rel="stylesheet" href="./index.css">
    </head>
    <body>
        <div class="loading">
            <!--Emmet 缩写 div.dot-->
            <!--Emmet 缩写 div.dot*36-->
            <div class="dot"></div>
            <div class="dot"></div>
            <div class="dot"></div>
            <div class="dot"></div>
            <div class="dot"></div>
            <div class="dot"></div>
            <div class="dot"></div>
            <div class="dot"></div>
            <div class="dot"></div>
            <div class="dot"></div>
            <div class="dot"></div>
            <div class="dot"></div>
            <div class="dot"></div>
            <div class="dot"></div>
            <div class="dot"></div>
            <div class="dot"></div>
            <div class="dot"></div>
            <div class="dot"></div>
            <div class="dot"></div>
            <div class="dot"></div>
            <div class="dot"></div>
            <div class="dot"></div>
            <div class="dot"></div>
            <div class="dot"></div>
            <div class="dot"></div>
            <div class="dot"></div>
            <div class="dot"></div>
            <div class="dot"></div>
            <div class="dot"></div>
            <div class="dot"></div>
            <div class="dot"></div>
            <div class="dot"></div>
            <div class="dot"></div>
            <div class="dot"></div>
            <div class="dot"></div>
            <div class="dot"></div>
        </div>
    </body>
</html>

index.less

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    background: #66c7f4;
}

@ballSize: 10px;
//@halfBallSize: 5px;
@containerSize: 150px;
//@halfContainerSize: 75px;
@n:36;
@ani-diratoion:2000ms;
// @pdeg:360deg/@n;
// 当前less编译器不支持 混合运算如 360deg /36 | 150px/2
@pdeg:15deg;
.loading {
    width: @containerSize;
    height: @containerSize;
    margin: 50px auto;
    position: relative;
    //矩形倒角占比 - 50%为椭圆，长宽一样为圆
    border-radius: 50%;
    //与圆圈的颜色
    //outline: 1px solid #fff;

    .dot {
        //绝对位置
        position: absolute;
        left: 50%;
        top: 50%;
        //方块的宽度
        width: @ballSize;
        //方块的宽度
        height: @ballSize;
        margin-left: -(@ballSize/2);
        margin-top: -(@ballSize/2);
        //景深
        perspective: 70px;
        //景深-加强3D效果
        transform-style: preserve-3d;
        //方块的颜色
        //background: red;
         //黑白球的共有样式
        &::before,&::after{
            content: '';
            position: absolute;
            width: 100%;
            height: 100%;
            //矩形倒角占比 - 50%为椭圆，长宽一样为圆
            border-radius: 50%;
        }
        //黑色小球样式
        &::before{
            background: #000;
            top: -100%;
            animation: moveBlack @ani-diratoion infinite;
        }
        //白色小球样式
        &::after{
            background: #fff;
            top: 100%;
            animation: moveWhite @ani-diratoion infinite;
        }
    }
 
}

// 黑球动画
@keyframes moveBlack {
    0%{
        animation-timing-function: ease-in;
    }
    25%{
        transform: translate3d(0, 100% ,@ballSize);
        animation-timing-function: ease-out;
    }
    50%{
        transform: translate3d(0, 200% ,0);
        animation-timing-function: ease-in;
    }
    75%{
        transform: translate3d(0, 100% ,-@ballSize);
        animation-timing-function: ease-out;
    }
}
// 白球球动画
@keyframes moveWhite {
    0%{
        animation-timing-function: ease-in;
    }
    25%{
        transform: translate3d(0, -100% ,-@ballSize);
        animation-timing-function: ease-out;
    }
    50%{
        transform: translate3d(0, -200% ,0);
        animation-timing-function: ease-in;
    }
    75%{
        transform: translate3d(0, -100% ,@ballSize);
        animation-timing-function: ease-out;
    }
}

//循环生成 n 个黑白球
.loop(@i) when(@i<=@n){
    //获取第i个dot元素
    .dot:nth-child(@{i}){
       //transform: rotate(@pdeg * @i) translateY(-@halfContainerSize);
       //每个黑白球 设置旋转角度和Y方向便宜值
       transform: rotate(@pdeg * @i) translateY(-(@containerSize/2));
        //每个黑白球的动画启动延迟
        &::before, &::after{
            animation-delay: -((@ani-diratoion/@n) * 6 * @i);
        }
    }
    //递归调用
    .loop(@i+1);
}
.loop(1);
/*
.dot:nth-child(1) {
    transform: rotate(@pdeg) translateY(-@halfContainerSize);
}
.dot:nth-child(2) {
    transform: rotate(@pdeg*2) translateY(-@halfContainerSize);
}
.dot:nth-child(3) {
    transform: rotate(@pdeg*3) translateY(-@halfContainerSize);
}
*/

index.css

此文件有index.less 通过 less编译器自动生成，html中引用了此文件

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
body {
  background: #66c7f4;
}
.loading {
  width: 150px;
  height: 150px;
  margin: 50px auto;
  position: relative;
  border-radius: 50%;
}
.loading .dot {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 10px;
  height: 10px;
  margin-left: -5px;
  margin-top: -5px;
  perspective: 70px;
  transform-style: preserve-3d;
}
.loading .dot::before,
.loading .dot::after {
  content: '';
  position: absolute;
  width: 100%;
  height: 100%;
  border-radius: 50%;
}
.loading .dot::before {
  background: #000;
  top: -100%;
  animation: moveBlack 2000ms infinite;
}
.loading .dot::after {
  background: #fff;
  top: 100%;
  animation: moveWhite 2000ms infinite;
}
@keyframes moveBlack {
  0% {
    animation-timing-function: ease-in;
  }
  25% {
    transform: translate3d(0, 100%, 10px);
    animation-timing-function: ease-out;
  }
  50% {
    transform: translate3d(0, 200%, 0);
    animation-timing-function: ease-in;
  }
  75% {
    transform: translate3d(0, 100%, -10px);
    animation-timing-function: ease-out;
  }
}
@keyframes moveWhite {
  0% {
    animation-timing-function: ease-in;
  }
  25% {
    transform: translate3d(0, -100%, -10px);
    animation-timing-function: ease-out;
  }
  50% {
    transform: translate3d(0, -200%, 0);
    animation-timing-function: ease-in;
  }
  75% {
    transform: translate3d(0, -100%, 10px);
    animation-timing-function: ease-out;
  }
}
.dot:nth-child(1) {
  transform: rotate(15deg) translateY(-75px);
}
.dot:nth-child(1)::before,
.dot:nth-child(1)::after {
  animation-delay: -333.33333333ms;
}
.dot:nth-child(2) {
  transform: rotate(30deg) translateY(-75px);
}
.dot:nth-child(2)::before,
.dot:nth-child(2)::after {
  animation-delay: -666.66666667ms;
}
.dot:nth-child(3) {
  transform: rotate(45deg) translateY(-75px);
}
.dot:nth-child(3)::before,
.dot:nth-child(3)::after {
  animation-delay: -1000ms;
}
.dot:nth-child(4) {
  transform: rotate(60deg) translateY(-75px);
}
.dot:nth-child(4)::before,
.dot:nth-child(4)::after {
  animation-delay: -1333.33333333ms;
}
.dot:nth-child(5) {
  transform: rotate(75deg) translateY(-75px);
}
.dot:nth-child(5)::before,
.dot:nth-child(5)::after {
  animation-delay: -1666.66666667ms;
}
.dot:nth-child(6) {
  transform: rotate(90deg) translateY(-75px);
}
.dot:nth-child(6)::before,
.dot:nth-child(6)::after {
  animation-delay: -2000ms;
}
.dot:nth-child(7) {
  transform: rotate(105deg) translateY(-75px);
}
.dot:nth-child(7)::before,
.dot:nth-child(7)::after {
  animation-delay: -2333.33333333ms;
}
.dot:nth-child(8) {
  transform: rotate(120deg) translateY(-75px);
}
.dot:nth-child(8)::before,
.dot:nth-child(8)::after {
  animation-delay: -2666.66666667ms;
}
.dot:nth-child(9) {
  transform: rotate(135deg) translateY(-75px);
}
.dot:nth-child(9)::before,
.dot:nth-child(9)::after {
  animation-delay: -3000ms;
}
.dot:nth-child(10) {
  transform: rotate(150deg) translateY(-75px);
}
.dot:nth-child(10)::before,
.dot:nth-child(10)::after {
  animation-delay: -3333.33333333ms;
}
.dot:nth-child(11) {
  transform: rotate(165deg) translateY(-75px);
}
.dot:nth-child(11)::before,
.dot:nth-child(11)::after {
  animation-delay: -3666.66666667ms;
}
.dot:nth-child(12) {
  transform: rotate(180deg) translateY(-75px);
}
.dot:nth-child(12)::before,
.dot:nth-child(12)::after {
  animation-delay: -4000ms;
}
.dot:nth-child(13) {
  transform: rotate(195deg) translateY(-75px);
}
.dot:nth-child(13)::before,
.dot:nth-child(13)::after {
  animation-delay: -4333.33333333ms;
}
.dot:nth-child(14) {
  transform: rotate(210deg) translateY(-75px);
}
.dot:nth-child(14)::before,
.dot:nth-child(14)::after {
  animation-delay: -4666.66666667ms;
}
.dot:nth-child(15) {
  transform: rotate(225deg) translateY(-75px);
}
.dot:nth-child(15)::before,
.dot:nth-child(15)::after {
  animation-delay: -5000ms;
}
.dot:nth-child(16) {
  transform: rotate(240deg) translateY(-75px);
}
.dot:nth-child(16)::before,
.dot:nth-child(16)::after {
  animation-delay: -5333.33333333ms;
}
.dot:nth-child(17) {
  transform: rotate(255deg) translateY(-75px);
}
.dot:nth-child(17)::before,
.dot:nth-child(17)::after {
  animation-delay: -5666.66666667ms;
}
.dot:nth-child(18) {
  transform: rotate(270deg) translateY(-75px);
}
.dot:nth-child(18)::before,
.dot:nth-child(18)::after {
  animation-delay: -6000ms;
}
.dot:nth-child(19) {
  transform: rotate(285deg) translateY(-75px);
}
.dot:nth-child(19)::before,
.dot:nth-child(19)::after {
  animation-delay: -6333.33333333ms;
}
.dot:nth-child(20) {
  transform: rotate(300deg) translateY(-75px);
}
.dot:nth-child(20)::before,
.dot:nth-child(20)::after {
  animation-delay: -6666.66666667ms;
}
.dot:nth-child(21) {
  transform: rotate(315deg) translateY(-75px);
}
.dot:nth-child(21)::before,
.dot:nth-child(21)::after {
  animation-delay: -7000ms;
}
.dot:nth-child(22) {
  transform: rotate(330deg) translateY(-75px);
}
.dot:nth-child(22)::before,
.dot:nth-child(22)::after {
  animation-delay: -7333.33333333ms;
}
.dot:nth-child(23) {
  transform: rotate(345deg) translateY(-75px);
}
.dot:nth-child(23)::before,
.dot:nth-child(23)::after {
  animation-delay: -7666.66666667ms;
}
.dot:nth-child(24) {
  transform: rotate(360deg) translateY(-75px);
}
.dot:nth-child(24)::before,
.dot:nth-child(24)::after {
  animation-delay: -8000ms;
}
.dot:nth-child(25) {
  transform: rotate(375deg) translateY(-75px);
}
.dot:nth-child(25)::before,
.dot:nth-child(25)::after {
  animation-delay: -8333.33333333ms;
}
.dot:nth-child(26) {
  transform: rotate(390deg) translateY(-75px);
}
.dot:nth-child(26)::before,
.dot:nth-child(26)::after {
  animation-delay: -8666.66666667ms;
}
.dot:nth-child(27) {
  transform: rotate(405deg) translateY(-75px);
}
.dot:nth-child(27)::before,
.dot:nth-child(27)::after {
  animation-delay: -9000ms;
}
.dot:nth-child(28) {
  transform: rotate(420deg) translateY(-75px);
}
.dot:nth-child(28)::before,
.dot:nth-child(28)::after {
  animation-delay: -9333.33333333ms;
}
.dot:nth-child(29) {
  transform: rotate(435deg) translateY(-75px);
}
.dot:nth-child(29)::before,
.dot:nth-child(29)::after {
  animation-delay: -9666.66666667ms;
}
.dot:nth-child(30) {
  transform: rotate(450deg) translateY(-75px);
}
.dot:nth-child(30)::before,
.dot:nth-child(30)::after {
  animation-delay: -10000ms;
}
.dot:nth-child(31) {
  transform: rotate(465deg) translateY(-75px);
}
.dot:nth-child(31)::before,
.dot:nth-child(31)::after {
  animation-delay: -10333.33333333ms;
}
.dot:nth-child(32) {
  transform: rotate(480deg) translateY(-75px);
}
.dot:nth-child(32)::before,
.dot:nth-child(32)::after {
  animation-delay: -10666.66666667ms;
}
.dot:nth-child(33) {
  transform: rotate(495deg) translateY(-75px);
}
.dot:nth-child(33)::before,
.dot:nth-child(33)::after {
  animation-delay: -11000ms;
}
.dot:nth-child(34) {
  transform: rotate(510deg) translateY(-75px);
}
.dot:nth-child(34)::before,
.dot:nth-child(34)::after {
  animation-delay: -11333.33333333ms;
}
.dot:nth-child(35) {
  transform: rotate(525deg) translateY(-75px);
}
.dot:nth-child(35)::before,
.dot:nth-child(35)::after {
  animation-delay: -11666.66666667ms;
}
.dot:nth-child(36) {
  transform: rotate(540deg) translateY(-75px);
}
.dot:nth-child(36)::before,
.dot:nth-child(36)::after {
  animation-delay: -12000ms;
}
/*
.dot:nth-child(1) {
    transform: rotate(@pdeg) translateY(-@halfContainerSize);
}
.dot:nth-child(2) {
    transform: rotate(@pdeg*2) translateY(-@halfContainerSize);
}
.dot:nth-child(3) {
    transform: rotate(@pdeg*3) translateY(-@halfContainerSize);
}
*/

扩展 关于Less四则运算除非处理

由于less编译器的版本问题可能会出现如下问题导致css生成的语句达不到预期效果如：

编写less代码

@containerSize: 150px;
@pdeg: 15deg;
@ani-diratoion: 2000ms;
@index: 2;
@count: 36;

.dot{
    width: @containerSize/2;
}

.dot:nth-child(1) {
    transform: rotate(@pdeg * @index) translateY(-@containerSize/2);
    &::before, 
    &::after {
        animation-delay: -@ani-diratoion / (@count * 6 * @index);
    }
}

生成css代码

其中150px/2、-150px/2、-2000ms / 432 ,这些并不能被浏览器识别，然后渲染。为什么会出现这种情况，是因为less编译器的版本、不同系统Windows、Mac等的语法兼容性导致的。

.dot {
  width: 150px/2;
}
.dot:nth-child(1) {
  transform: rotate(30deg) translateY(-150px/2);
}
.dot:nth-child(1)::before,
.dot:nth-child(1)::after {
  animation-delay: -2000ms / 432;
}

解决方案 将除号和参与运算的变量或数字用小括号()包起来

Less 代码

@containerSize: 150px;
@pdeg: 15deg;
@ani-diratoion: 2000ms;
@index: 2;
@count: 36;

.dot{
    width: (@containerSize/2);
}

.dot:nth-child(1) {
    transform: rotate(@pdeg * @index) translateY(-(@containerSize/2));
    &::before, 
    &::after {
        animation-delay: -(@ani-diratoion / @count * 6 * @index);
    }
}

CSS 代码

.dot {
  width: 75px;
}
.dot:nth-child(1) {
  transform: rotate(30deg) translateY(-75px);
}
.dot:nth-child(1)::before,
.dot:nth-child(1)::after {
  animation-delay: -666.66666667ms;
}

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

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

相关文章

Android的Context详解 - 揭开Context的神秘面纱

Android的Context详解 - 揭开Context的神秘面纱

这篇文章是基于我四年前的一篇文章进行更正和深入探究。背景是&#xff0c;2019年4月份我在找工作&#xff0c;看到一个问题&#xff0c;问this&#xff0c;getBaseContext()、getApplication()、getApplicationContext()的区别。当时我写了简单的demo验证&#xff0c;得出了跟…
阅读更多...
看看螯合物前体多肽试剂DOTA-E[c(RGDfK)2]的全面解析吧！

看看螯合物前体多肽试剂DOTA-E[c(RGDfK)2]的全面解析吧！

【产品描述】 DOTA-E[c(RGDfK)2]螯合物前体多肽试剂&#xff0c;RGD肽指含有Arg-Gly-Asp三个氨基酸组成的序列多肽&#xff0c;可以提供大量的RGD直线肽&#xff0c;RGD环肽&#xff0c;RGD双环肽、RGD模拟肽等&#xff0c;也可以根据客户需求定制RGD肽。 DOTA-E [c (RGDfK) 2…
阅读更多...
6.3 B树

6.3 B树

多路平衡查找树 1.定义 B树的阶&#xff1a;B树中所有结点的孩子个数的最大值&#xff0c;表示成m m阶B树&#xff1a;空树或者满足如下特性的m叉树 特性&#xff1a; 1.树中每个结点最多子树 m 关键字m-1 2.根节点不是终端结点&#xff0c;至少有两棵子树 3.根结点除外&…
阅读更多...
Java 遍历List的两种方式

Java 遍历List的两种方式

可参考文章 Notepad编译并运行java代码_notepad怎么运行java代码_西晋的no1的博客-CSDN博客 中的第二种方法测试下述代码。 在java中&#xff0c;可以使用for循环和使用for-each循环两种方式遍历List。 1.使用for循环遍历List 2.使用for-each遍历List 注意&#xff1a;使用for-…
阅读更多...
Java使用Maven工程操作OpenGL ES绘制三角形和圆形；绘制完成后操作键盘控制然图形移动

Java使用Maven工程操作OpenGL ES绘制三角形和圆形；绘制完成后操作键盘控制然图形移动

OpenGL ES 绘制三角形&#xff0c;操作键盘移动位置 PS&#xff1a;想快速看到效果的小伙伴&#xff0c;可以在引入依赖后&#xff0c;先跳到完整代码部分 第一步&#xff1a;依赖引入 <properties><lwjgl.version>3.2.3</lwjgl.version><joml.version&…
阅读更多...
mysql 密码丢失的解决方案

mysql 密码丢失的解决方案

问题描述 mysql 密码丢失的解决方案 解决方案&#xff1a; 停止服务; 重新启动服务&#xff1a;mysqld.exe --skip-grant-tables //启动服务器但是跳过权限; 当前启动的服务器没有权限概念&#xff1a;非常危险&#xff0c;任何客户端&#xff0c;不需要任何用户信息都可…
阅读更多...
Pycharm连接远端Python环境操作Spark

Pycharm连接远端Python环境操作Spark

文章目录 1. 创建工程&#xff0c;指定远端python解析器2. 添加远端python解析器3.配置完成4.本地文件自动同步远端5.删除远端python解析器(非必须操作&#xff0c;重新配置时参考该项)6. 文件模板配置 远程连接方案, 允许程序员连接远端测试环境, 确保环境的统一, 避免各种环境…
阅读更多...
消息队列中间件（一）

消息队列中间件（一）

场景 流量削峰 应用解耦 异步处理 分类 ActiveMQ 优&#xff1a;单机吞吐万级&#xff0c;时效性ms级&#xff0c;可用性高&#xff08;主从架构&#xff09;&#xff0c;可靠性高&#xff08;丢失率低&#xff09; 缺&#xff1a;官方维护少&#xff0c;高吞吐场景较少…
阅读更多...
QT Creator上位机学习（二）基础控件及信号与槽

QT Creator上位机学习（二）基础控件及信号与槽

c# 系列文章目录 文章目录 布局控件信号与槽程序图标使用技巧 布局控件 美化界面的时候&#xff0c;经常需要进行一些控件的布局&#xff0c;这时需要使用一些容器类。 在快捷栏出&#xff0c;也有一些布局设计的选择 如上图&#xff0c;其中涉及到几种编辑状态&#xff1…
阅读更多...
Math简单学习

Math简单学习

1.绝对值 就变个符号 public static double abs(double a) {return (a < 0.0D) ? 0.0D - a : a; }public static float abs(float a) {return (a < 0.0F) ? 0.0F - a : a;}public static int abs(int a) {return (a < 0) ? -a : a;}IntrinsicCandidatepublic sta…
阅读更多...
Redis【实战篇】---- 优惠卷秒杀

Redis【实战篇】---- 优惠卷秒杀

Redis【实战篇】---- 优惠卷秒杀 1. 全局唯一ID2. Redis实现全局唯一ID3. 添加优惠券4. 实现秒杀哦下单5. 库存超卖问题分析6. 乐观锁解决超卖问题7. 优惠券秒杀 ---- 一人一单8. 集群环境下的并发问题 1. 全局唯一ID 每个店铺都可以发布优惠券&#xff1a; 当用户抢购时&…
阅读更多...
封装websocket请求-----vue2

封装websocket请求-----vue2

参考 (875条消息) 封装websocket请求-----vue项目实战&#xff08;完整版&#xff09;_vue websocket封装_winne雪的博客-CSDN博客https://blog.csdn.net/m0_38134431/article/details/105794108 一、在utils目录下创建websocket.js文件 import {Message} from element-ui /…
阅读更多...
Mac 已经在.bash_profie中配置过sdk环境依然报zsh: command not found: adb

Mac 已经在.bash_profie中配置过sdk环境依然报zsh: command not found: adb

提示 前置条件 已经安装好Android studio 然后~/.bash_profile 或.bash_profile也已经配置sdk路径&#xff0c;打开第二个终端输入adb时提示zsh: command not found: adb 解决办法 打开终端输入下面命令 echo export ANDROID_HOME/Users/$USER/Library/Android/sdk >>…
阅读更多...
近日，我处理了一个大文件导入 nginx HTTP/1.1“ 413 585的问题

近日，我处理了一个大文件导入 nginx HTTP/1.1“ 413 585的问题

今天&#xff0c;导入一个1万多条数据的excel文件&#xff0c;本地没有用到nginx&#xff0c;导入很顺畅 部署到了线上后&#xff0c;导入文件后后台并没有日志输出&#xff0c;说明没有进入后端 经过摸排&#xff0c;分析&#xff0c;最终发现&#xff0c;是nginx这关没过 …
阅读更多...
智能相机的功能介绍

智能相机的功能介绍

智能视觉检测相机主要是应用在工业检测领域图像分析识别、视觉检测判断。相机具有颜色有无判别、颜色面积计算、轮廓查找定位、物体特征灰度匹配、颜色或灰度浓淡检测、物体计数、尺寸测量、条码二维码识别读取、尺寸测量、机械收引导定位、字符识别等功能。相机带有HDMI高清视…
阅读更多...
stm32使用clion移植canfestival(canopen)

stm32使用clion移植canfestival(canopen)

官方网站 https://canfestival.org/index.html.en 非官方的下载地址 GitHub - ljessendk/CanFestival 每个版本的源码会有些差异&#xff0c;移植代码的时候最好把源码也一并移植 以下使用硬石h743开发板, 并使用TIM8作为FDCAN1的定时器 STM32CubeMax 设置APB1的频率为20…
阅读更多...
vscode设置可以搜索包含node_modules中的文件

vscode设置可以搜索包含node_modules中的文件

步骤3中删除掉node_modules&#xff0c;再搜索的时候&#xff0c;node_modules的匹配到代码也会展示出来了。 如果不想要被搜索文件包含node_modules,再添加上就可以。
阅读更多...
数值分析算法 MATLAB 实践 数值优化算法

数值分析算法 MATLAB 实践 数值优化算法

数值分析算法 MATLAB 实践 数值优化算法 黄金分割法 function [x,y,k_cnt ] Goldensection(fun, a, b, eps) %fun为优化函数&#xff0c;a为区间左侧值&#xff0c;b为区间右侧值&#xff0c;eps为精度 % 黄金分割法 k_cnt0;while(b - a > eps)x1 a 0.382 * (b - a);x2 a…
阅读更多...
OpenXML库（office文档读写库）的安装

OpenXML库（office文档读写库）的安装

本体安装 OpenXml库是由微软维护的一个开源的Office文档读写库&#xff0c;其与其他类似用途的库的比较可以看到这篇文章。 在C#中使用OpenXml非常简单&#xff0c;只需要使用NuGet安装其程序包即可&#xff0c;流程如下(NuGet这东西真的是个神器啊&#xff01;)&#xff1a;…
阅读更多...
探索嵌入式开发领域：单片机、ARM、Android底层的紧密联系

探索嵌入式开发领域：单片机、ARM、Android底层的紧密联系

作为一个曾编写ARM教程和参与Android产品开发的专家&#xff0c;我发现单片机、ARM、嵌入式开发和Android底层开发之间存在紧密的联系。对于那些希望在嵌入式开发领域发展的人来说&#xff0c;了解这些领域的知识至关重要。为了帮助你更好地学习这些内容&#xff0c;我总结了一…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023