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

CSS3 动画相关属性实例大全（四)（font、height、left、letter-spacing、line-height 属性）

news 文章来源：https://blog.csdn.net/weixin_69553582/article/details/143067731 2025/5/15 9:24:35

CSS3 动画相关属性实例大全（四)

（font、height、left、letter-spacing、line-height 属性）

本文目录：

一、font 属性（所有字体属性）

1.1、font-size属性（指定字体的大小）

1.2、font-size-adjust 属性（调整字体大小）

1.3、font-stretch属性（定义字体外观）

1.4、font-weight属性（指定字体的粗细程度）

二、height属性（元素的高度）

三、left属性（元素的左外边距边界与其包含块左边界之间的偏移）

四、letter-spacing属性（字符间距的大小）

五、line-height 属性（设置多行元素的空间量）

一、font 属性（所有字体属性）

font 属性可以用来作为 font-style, font-variant, font-weight, font-size, line-height 和 font-family 属性的简写，或将元素的字体设置为系统字体

<style> 
#animation40 {border: 1px solid black;width: 150px;height: 150px;-webkit-animation: animation40a 2s infinite; animation: animation40a 2s infinite;
}@-webkit-keyframes animation40a{ 50% {font: 25px bold; }}
@keyframes animation40a{ 50% {font: 25px bold; }}
</style>
<div id="animation40"><p>font 属性是所有字体属性的简写</p>
</div>

改变 font 属性：font: 25px bold

值    Font 特性描述
font-style规定字体样式。
font-variant 规定字体异体
font-weight规定字体粗细。
font-size/line-height规定字体尺寸和行高。
font-family规定字体系列。
caption 定义被标题控件（比如按钮、下拉列表等）使用的字体。
icon定义被图标标记使用的字体。
menu定义被下拉列表使用的字体。
message-box定义被对话框使用的字体。
small-caption caption 字体的小型版本。
status-bar定义被窗口状态栏使用的字体。

  
1.1、font-size属性（指定字体的大小）

font-size CSS 属性指定字体的大小。
因为该属性的值会被用于计算 em 和 ex 长度单位，定义该值可能改变其他元素的大小

font-size属性（指定字体的大小）
<absolute-size>绝对大小值

font-size: xx-small;

font-size: x-small;

font-size: small;

font-size: medium;

font-size: large;

font-size: x-large;

font-size: xx-large;

<relative-size>相对大小值

font-size: larger;

font-size: smaller;

<length>长度值

font-size: 12px;

font-size: 0.8em;

<percentage>百分比值

font-size: 80%;  font-size:250%，font-size:200%

font-size: inherit;

JavaScript 语法：object.style.fontSize="larger"
<style> 
#animation41 {border: 1px solid black;width: 200px;height: 100px;font-size: xx-small;color: purple;-webkit-animation: animation41a 2s infinite; animation: animation41a 2s infinite;}
@-webkit-keyframes animation41a{ 50% {font-size: 40px;}}
@keyframes animation41a{ 50% {font-size: 40px; }}
</style>
<div id="animation41"><p>逆境清醒</p>
</div>

改变 font-size 属性：从 font-size: xx-small;  到  font-size: 40px;

1.2、font-size-adjust 属性（调整字体大小）

font-size-adjust属性，通过指定font-size-adjust属性，浏览器将调整字体大小，无论字体系列
让您更好的控制字体大小，当第一个选择的字体不可用时，浏览器使用第二个指定的字体。

这可能会导致改变字体大小。为了防止这种情况，使用的font-size-adjust属性。

所有字体都能有"aspect值"，这是小写字母"X"和大写字母"X"的大小差异。

当浏览器知道"aspect值"为第一选择的字体时，浏览器可以找出什么样的font-size使用第二选择字体显示文字。

目前支持的浏览器数量不足，暂不举例

font-size-adjust CSS 属性定义字体大小应取决于小写字母，而不是大写字母。在字体较小时，字体的可读性主要由小写字母的大小决定，通过此选项即可进行调整。

1.3、font-stretch属性（定义字体外观）

Chrome浏览器
font-stretch 属性为字体定义一个正常或经过伸缩变形的字体外观，这个属性并不会通过伸展/缩小而改变字体的几何外形，
如font-feature-settings和font-variant属性，
它仅仅意味着当有多种字体可供选择时，会为字体选择最适合的大小。
normal指定默认字体
semi-condensed, condensed, extra-condensed, ultra-condensed小于默认字体，其中 ultra-condensed 是缩的最小的字体
semi-expanded, expanded, extra-expanded, ultra-expanded大于默认字体的值
<style>@font-face {src: url('fonts/LeagueMonoVariable.ttf');font-family:'LeagueMonoVariable';font-style: normal;font-stretch: 1% 500%; /* Required by Chrome */
}.container {  font: 1.5rem 'LeagueMonoVariable', sans-serif;}.condensed {  font-stretch: 50%;}.normal {  font-stretch: 100%;}.expanded {  font-stretch: 200%;}<style>
<div class="container"><p class="condensed">LeagueMonoVariable</p><p class="normal">LeagueMonoVariable</p><p class="expanded">LeagueMonoVariable</p>
</div>

1.4、font-weight属性（指定字体的粗细程度）

font-weight CSS 属性指定了字体的粗细程度。

一些字体只提供 normal 和 bold 两种值。

normal 默认值。定义标准的字符。
bold 定义粗体字符。
bolder定义更粗的字符。
lighter定义更细的字符。
100~900定义由细到粗的字符。400 等同于 normal，而 700 等同于 bold。
inherit 规定应该从父元素继承字体的粗细。
JavaScript 语法：object.style.fontWeight="900"
<style>#animation44 {border: 1px solid black;width: 200px;height: 200px;font-weight: lighter;color: purple;font-size: 40px;-webkit-animation: animation44a 2s infinite;animation: animation44a 2s infinite;}
@-webkit-keyframes animation44a{ 50% {font-weight: bolder;}}
@keyframes animation44a{ 50% {font-weight: bolder; }}
</style>
<div id="animation44" style="text-align:center;"><p>逆境清醒</p>
</div>

改变 font-weight属性：从 font-weight: lighter;到 font-weight: bolder;

二、height属性（元素的高度）

height CSS 属性指定了一个元素的高度。

默认情况下，这个属性决定的是内容区（ content area）的高度，

但是，如果将 box-sizing 设置为 border-box ,

这个属性决定的将是边框区域（border area）的高度。

    <style>#animation45 {width: 150px;height: 50px;background: #CCCCFF;border: 1px solid #000000;-webkit-animation: animation45a 2s infinite;animation: animation45a 2s infinite;}@-webkit-keyframes animation45a{  50% {height: 200px;}        }@keyframes animation45a{    50% {height: 200px;}        }</style>
    <div id="animation45" style="text-align:center;"><p>逆境清醒</p></div>

改变  height属性：从height: 50px;到 height: 200px;

三、left属性（元素的左外边距边界与其包含块左边界之间的偏移）

left属性定义了

定位元素的左外边距边界与其包含块左边界之间的偏移，

非定位元素设置此属性无效。

left的效果取决于元素的position属性：

  • 当position设置为absolute或fixed时，left属性指定了定位元素左外边距边界与其包含块左边界之间的偏移。
  • 当position设置为relative时，left属性指定了元素的左边界离开其正常位置的偏移。
  • 当position设置为sticky时，如果元素在 viewport 里面，left属性的效果和 position 为relative等同；如果元素在 viewport 外面，left属性的效果和 position 为fixed等同。
  • 当position设置为static时，left属性无效。
  • 当left和right​​​​​​ 同时指定时，元素的位置会被重复指定。当容器是从左到右时，left的值会被优先设定；当容器是从右到左时，right的值会被优先设定。
    <style>#animation46 {top:80px;width: 100px;height:50px;margin: auto;border: 2px solid #111111;background-color:lightblue;color:black;-webkit-animation: animation46a 1s infinite; animation: animation46a 1s infinite;}@-webkit-keyframes animation46a{ 50% {left: 620px;} }@keyframes animation46a{ 50% {left: 620px;} }</style>
<div id="animation46">逆境清醒</div>

left属性定义了

定位元素的左外边距边界与其包含块左边界之间的偏移，

非定位元素设置此属性无效。

四、letter-spacing属性（字符间距的大小）

letter-spacing 属性

增加或减少字符间的空白，

表现效果为字符间距的大小

属性值意义
normal默认。规定字符间没有额外的空间。
length 定义字符间的固定空间（允许使用负值）。
inherit规定应该从父元素继承 letter-spacing 属性的值。

    

    <style>#animation47 {width: 200px;height: 300px;border: 1px solid black;background-color: lightblue;color: black;letter-spacing: normal;-webkit-animation: animation47a 1s infinite;animation: animation47a 1s infinite;}@-webkit-keyframes animation47a {50% {letter-spacing: 20px; }}@keyframes animation47a {50% { letter-spacing: 20px; }}</style>
 <div id="animation47"><p>当 你 孤 单 无 助 地 面 对 强 敌 时，谁 会 是 那 个 信 得 过 的 战 友？逆 境 清 醒 送 你 一 只 守 护 兔。</p></div>

   

etter-spacing 属性：

增加或减少字符间的空白，表现效果为字符间距的大小
 

改变 letter-spacing  属性：从 letter-spacing: normal;到 letter-spacing: 20px;

     

五、line-height 属性（设置多行元素的空间量）

line-height CSS 属性用于设置多行元素的空间量，如多行文本的间距。
对于块级元素，它指定元素行盒（line boxes）的最小高度。
对于非替代的 inline 元素，它用于计算行盒（line box）的高度。

    <style>#animation48 {width: 200px;height: 250px;border: 1px solid black;background-color: lightblue;color: black;line-height: normal;-webkit-animation: animation48a 1s infinite;animation: animation48a 1s infinite;}@-webkit-keyframes animation48a {50% {line-height: 50px;  } }@keyframes animation48a {50% {line-height: 50px; } }</style>
<div id="animation48"><p>当 你 孤 单 无 助 地 面 对 强 敌 时，谁 会 是 那 个 信 得 过 的 战 友？逆 境 清 醒 送 你 一 只 守 护 兔。</p></div>

改变  line-height 属性：从 line-height: normal;到 line-height: 50px;

   未完待续》》》

  • 1、CSS3 动画相关属性实例大全（一)（@keyframes ，background属性，border 属性）
  • 2、CSS3 动画相关属性实例大全（二)（bottom 、box-shadow、clip、color 、column-count、column-gap、column-rule、column-rule-color、column-rule-width、column-width 属性）
  • 3、CSS3 动画相关属性实例大全（三)（columns、filter、flex、flex-basis 、flex-grow、flex-shrink属性）
  • 4、CSS3 动画相关属性实例大全（四)（font、height、left、letter-spacing、line-height 属性）

            

            推荐阅读：CSS @规则(At-rules)详解系列索引目录

27d5b50d93a089da35ee1a28905f9719.jpeg​​​

c64d8b4d0b6842ebe1196c0b1e3fba51.jpeg​​​

a136a43cd0015088d4ce37b1bb653533.jpeg​​​

给照片换底色（python+opencv）猫十二分类基于大模型的虚拟数字人__虚拟主播实例

0f92b28e915ca3cc26cfaaf47c5fc62d.jpeg​​​​​

5d2b51be3e7e932be95355088e17d524.jpeg​​​​​

3cf3fe3c1a186bfcbf12d4755b8950ae.jpeg​​​​​

计算机视觉__基本图像操作（显示、读取、保存）直方图（颜色直方图、灰度直方图）直方图均衡化（调节图像亮度、对比度）

849b7a72434213407c862c8f8e071a22.png​​​​​

9412a31659ba6db83d806c3f354dd1c0.png​​​​​

fb29a865f75af8352dca5e3d56a09004.png​​​​​

语音识别实战（python代码）(一）

 人工智能基础篇

 计算机视觉基础__图像特征

637c349e8206c0651d1f2751ba128912.png​​​​​

 matplotlib 自带绘图样式效果展示速查（28种，全）

ec9793633e16de7b52fbf0b74ecfa2f3.png​​​​​

Three.js实例详解___旋转的精灵女孩(附完整代码和资源)（一）

6e420cca6a1313b93948785f689f5723.png​​​​​

1da3f182e081ad8f3cfcf53013909b8b.png​​​​​

ca733c1a99c6457a762d0e503855ce79.png​​​​​

立体多层玫瑰绘图源码__玫瑰花python 绘图源码集锦

 Python 3D可视化（一）

让你的作品更出色——词云Word Cloud的制作方法（基于python，WordCloud，stylecloud)

f92dfeb72ec683025a63db2fe8a26492.png​​​​​

1b2a866ebb074a1e5859dad42c435d5c.jpeg​​​​​

8207b63755bf37b10807a046080f14df.png​​​​​

 python Format()函数的用法___实例详解（一）(全，例多）___各种格式化替换，format对齐打印

 用代码写出浪漫__合集（python、matplotlib、Matlab、java绘制爱心、玫瑰花、前端特效玫瑰、爱心）

python爱心源代码集锦（18款）

b97d56fe7e3ce6234cb182ad86fef4ed.jpeg​​​​​

6871f222e7db3f8ce83336ad50311c3a.png​​​​​

b89ed1147e8a76e6c64b812d65e8f2ef.png​​​​​

 Python中Print()函数的用法___实例详解(全，例多）

 Python函数方法实例详解全集(更新中...)

 《 Python List 列表全实例详解系列（一）》__系列总目录、列表概念

7090a17485b11d9da69e37e5756c6910.png​​​​​

50313523c8c19f29270fb1110fe66ae9.png​​​​​

用代码过中秋，python海龟月饼你要不要尝一口？

 python练习题目录

4c77c7a60782637db9e27b3deec7abee.png​​​​​

c397ed3a22c7885194eb92b5b3883322.png​​​​​

a18fbd27f15eaa98f0bb5a4fed8cbd8b.png​​​​​

草莓熊python turtle绘图（风车版）附源代码

 ​草莓熊python turtle绘图代码（玫瑰花版）附源代码

 ​草莓熊python绘图（春节版，圣诞倒数雪花版）附源代码

36e2af3bf474c59b9c430b223417793b.png​​​​​

542dbf91cfafa23e1ccdee94a7b22397.png​​​​​

 巴斯光年python turtle绘图__附源代码

皮卡丘python turtle海龟绘图（电力球版）附源代码

68b0f4704053ab870c16bb4e37897d63.png​​​​​

25ff4b8d741f0942c50dd96b7e866386.jpeg​​​​​

59bb0955631256520f0edd17f8304669.jpeg​​​​​

 Node.js (v19.1.0npm 8.19.3) vue.js安装配置教程（超详细）

 色彩颜色对照表（一）(16进制、RGB、CMYK、HSV、中英文名)

2024年6月多家权威机构____编程语言排行榜__薪酬状况

7dda70990181a20a430cc7b13dc9d8aa.png​​​​​​

a1fea2de0187913a4cdb18473c512c55.png​​​​​

96e1df3760ce3017026da2d1de069869.png​​​​​

 手机屏幕坏了____怎么把里面的资料导出（18种方法）

【CSDN云IDE】个人使用体验和建议（含超详细操作教程）（python、webGL方向)

 查看jdk安装路径，在windows上实现多个java jdk的共存解决办法，安装java19后终端乱码的解决

fa753f11d26d967646a85b78b53dc703.png​​​​​

vue3 项目搭建教程（基于create-vue，vite，Vite + Vue）

4290a52c20eee861ee159e17659342f5.png​​​​​

b126b976989a1e4f1ae40867407e8f4d.png​​​​​

15f065b7e46b238db1e7382f70fd7076.png​​​​​

2023年春节祝福第二弹——送你一只守护兔，让它温暖每一个你【html5 css3】画会动的小兔子，炫酷充电，字体特

 别具一格，原创唯美浪漫情人节表白专辑，(复制就可用)（html5,css3,svg)表白爱心代码(4套)

SVG实例详解系列（一）(svg概述、位图和矢量图区别（图解）、SVG应用实例）

f3a00b9bf85e8d36c21d8e9785f43a53.png​​​​​

1f143789d9652fd35c1fabf11b6f149c.png​​​​​

2c8047a9f87aa22a8abe57ad0081b1d9.png​​​​​

【程序人生】卡塔尔世界杯元素python海龟绘图（附源代码），世界杯主题前端特效5个（附源码）HTML+CSS+svg绘制精美彩色闪灯圣诞树，HTML+CSS+Js实时新年时间倒数倒计时(附源代码)

 2023春节祝福系列第一弹（上）（放飞祈福孔明灯，祝福大家身体健康）（附完整源代码及资源免费下载）

a01e7c6663c27936b3c174265db14012.png​​​​​

6d12eed561af36157625a07b771f9b0b.png​​​​​

af9dcebc4110cf5b9a012a3ef7d268fe.png​​​​​

 tomcat11、tomcat10 安装配置（Windows环境）（详细图文）

 Tomcat端口配置（详细）

 Tomcat 启动闪退问题解决集（八大类详细）

相关文章：

CSS3 动画相关属性实例大全（四)（font、height、left、letter-spacing、line-height 属性）

CSS3 动画相关属性实例大全&#xff08;四) &#xff08;font、height、left、letter-spacing、line-height 属性&#xff09; 本文目录&#xff1a; 一、font 属性&#xff08;所有字体属性&#xff09; 1.1、font-size属性&#xff08;指定字体的大小&#xff09; 1.2、f…...

编程日记 2024/10/20 5:50:22

大模型涌现判定

什么是大模型&#xff1f; 大模型&#xff1a;是“规模足够大&#xff0c;训练足够充分&#xff0c;出现了涌现”的深度学习系统&#xff1b; 大模型技术的革命性&#xff1a;延申了人的器官的功能&#xff0c;带来了生产效率量级提升&#xff0c;展现了AGI的可行路径&#x…...

编程日记 2024/10/20 5:48:20

LeetCode 1456.定长子串中元音的最大数目

题目&#xff1a; 给你字符串 s 和整数 k 。 请返回字符串 s 中长度为 k 的单个子字符串中可能包含的最大元音字母数。 英文中的 元音字母 为&#xff08;a, e, i, o, u&#xff09;。 思路&#xff1a;定长滑动窗口 入 更新 出 代码&#xff1a; class Solution {pub…...

编程日记 2024/10/20 5:47:19

freeswitch-esl 三方设备实现监听功能

使用场景： A和B在通话中，C想监听A和B通话内容 方法一： 修改拨号计划<extension name="global" continue="true"><condition><action application="info"/>...

编程日记 2024/10/20 5:46:19

【LeetCode】123.买卖股票的最佳时间

清晰明了的思路是解决问题的至上法宝。如何把一个复杂的问题拆成简单的问题&#xff0c;就是我们需要考虑的。 1. 题目 2. 思想 这道题虽然是难题&#xff0c;但是思想比较简单。 题目要求说至多买卖两次&#xff0c;也就是说&#xff0c;也可以买卖一次&#xff0c;这种情况…...

编程日记 2024/10/20 5:45:18

elk部署安装

elk部署 前提准备1、elasticsearch2、kibana3、logstash 前提准备 1、提前装好docker docker-compose相关命令 2、替换docker仓库地址国内镜像源 cd /etc/docker vi daemon.json # 替换内容 {"registry-mirrors": [ "https://docker.1panel.dev", "ht…...

编程日记 2024/10/20 5:44:17

使用 JAX 进行 LLM 分布式监督微调

LLM distributed supervised fine-tuning with JAX — ROCm Blogs (amd.com) 24年1月25日&#xff0c;Douglas Jia 发布在AMD ROCm 博客上的文章。 在这篇文章中&#xff0c;我们回顾了使用 JAX 对基于双向编码器表示&#xff08;BERT&#xff09;的大型语言模型&#xff08;LL…...

编程日记 2024/10/20 5:42:15

【简单版】通过 Window.performance 实现前端页面(性能)监控

1 背景 前端监控系统告警xx接口fetchError 问题&#xff1a;前端监控系统没有更多的错误信息&#xff0c;查询该fetch请求对应的接口日志返回200状态码、无请求异常记录&#xff0c;且后台能查到通过该fetch请求成功发送的数据。那是前端页面的错误还是前端监控系统的问题&…...

编程日记 2024/10/20 5:41:14

微信小程序考试系统(lw+演示+源码+运行）

摘要 随着信息技术在管理上越来越深入而广泛的应用&#xff0c;管理信息系统的实施在技术上已逐步成熟。本文介绍了微信小程序考试系统的开发全过程。通过分析微信小程序考试系统管理的不足&#xff0c;创建了一个计算机管理微信小程序考试系统的方案。文章介绍了微信小程序考…...

编程日记 2024/10/20 5:40:12

手机摄影入门

感觉会摄影的人是能够从生活中发现美的人。 我不太会拍照&#xff0c;觉得拍好的照片比较浪费时间&#xff0c;而且缺乏审美也缺乏技巧&#xff0c;所以拍照的时候总是拍不好。但有时候还是需要拍一些好看的照片的。 心态和审美可能需要比较长时间提升&#xff0c;但一些基础…...

编程日记 2024/10/20 5:38:11

微信小程序手机号授权获取（aes加密手机号）

<view class="container"> <view class=topTabSwiper> <view class=tab {{currentData == 0 ? "tabBorer" : ""}} data-current = "0" bindtap=checkCurrent>一键授权<span class="tab_bor"><…...

编程日记 2024/10/20 5:37:08

asyn queueRequest使用实例

使用queueRequest读写端口驱动的示例&#xff0c;驱动驱动程序使用一个基于asyn实现了asynCommon和asynOctet的驱动程序-CSDN博客中编写的驱动程序&#xff0c;本程序的C代码如下&#xff1a; #include <stdlib.h> #include <stdio.h> #include <string.h>#…...

编程日记 2024/10/20 5:36:06

关于jmeter设置为中文问题之后无法保存设置的若干问题

1、jemeter如何设置中文模式 Options--->Choose Language--->Chinese(Simplifies), 如此设置后就可显示中文模式(缺点&#xff1a;下次打开还是英文)&#xff1b;如下图所示&#xff1a; 操作完成之后&#xff1a; 但是下次重启之后依旧是英文&#xff1b; 2、在jmeter.…...

编程日记 2024/10/20 5:35:05

基于FPGA的信号发生器verilog实现,可以输出方波,脉冲波,m序列以及正弦波,可调整输出信号频率

目录 1.算法运行效果图预览 2.算法运行软件版本 3.部分核心程序 4.算法理论概述 5.算法完整程序工程 1.算法运行效果图预览 (完整程序运行后无水印) 输出方波 输出脉冲波 输出m随机序列 输出正弦波 2.算法运行软件版本 vivado2019.2 3.部分核心程序 &#xff08;完整…...

编程日记 2024/10/20 5:32:03

背景全文及翻译

背景 Oracle数据向MySQL同步&#xff0c;没有最新数据&#xff0c;于是在plsql手敲SQL筛选最新数据时&#xff0c;执行报错。 问题描述 通过日期字段筛选最近的数据&#xff0c;我用了类似这样的语句&#xff1a; SELECT * FROM orders WHERE order_date > 2022/01/01;我…...

编程日记 2024/10/20 5:31:02

JAVA地狱级笑话

为什么Java开发者总是不怕黑暗&#xff1f; 因为他们总是有null指针来照亮路。 Java程序员最讨厌的音乐是什么&#xff1f; Garbage Collection旋律&#xff0c;节奏总是让他们烦躁。 为什么Java中的HashMap很擅长社交&#xff1f; 因为它总是能快速找到key对应的朋友。 Java开…...

编程日记 2024/10/20 5:28:59

宝塔PHP8.1安装fileinfo拓展失败解决办法

在宝塔面板中安装PHP8.1后&#xff0c;安装fileinfo扩展一直安装不上&#xff0c;查看日志有报错&#xff0c;于是手动来安装也报错。 宝塔报错&#xff1a; 手动命令行编译安装同&#xff0c;也有报错 cd /www/server/php/81/src/ext/fileinfo/ make distclean ./configure …...

编程日记 2024/10/20 5:27:58

Python 魔术方法

在Python中&#xff0c;魔术方法&#xff08;Magic Methods&#xff09;或称为双下划线方法&#xff08;Dunder Methods&#xff09;&#xff0c;是一类具有特殊用途的方法&#xff0c;其名称前后都带有两个下划线&#xff08;如 __init__、__str__ 等&#xff09;。这些方法定…...

编程日记 2024/10/20 5:26:57

03 go语言（golang） - fmt包基本类型

fmt包 在Go语言中&#xff0c;fmt 包是一个非常重要且广泛使用的标准库包&#xff0c;它提供了格式化I/O&#xff08;输入/输出&#xff09;功能&#xff0c;类似于C语言中的 printf 和 scanf。通过这个包&#xff0c;你可以读取输入并将数据格式化输出到标准输出或其他写入器…...

编程日记 2024/10/20 5:25:56

Docker本地镜像发布到阿里云镜像服务的简易指南

1 阿里云容器镜像服务 阿里云容器镜像服务&#xff08;Alibaba Cloud Container Registry&#xff0c;简称ACR&#xff09;是一个为容器镜像、Helm Chart等云原生资产提供安全托管及高效分发的平台。它支持多架构容器镜像&#xff0c;包括Linux、Windows、ARM等&#xff0c;以…...

编程日记 2024/10/20 5:24:56

大数据学习---快速了解clickhouse数据库

ClickHouse数据库介绍 ClickHouse是一款由Yandex开发的列式数据库管理系统&#xff08;DBMS&#xff09;&#xff0c;适用于在线分析处理&#xff08;OLAP&#xff09;场景。它具有高性能、可扩展性、实时更新等特点&#xff0c;适用于处理大规模数据。 特点 列式存储&#x…...

编程日记 2024/10/20 5:23:54

哪些方法可以缓解面试紧张？

面试紧张是许多人在面对重要职业机会时的一种常见情绪。虽然一定程度的紧张可能激发人的潜能&#xff0c;但过度的紧张则可能影响到面试表现。为了缓解面试紧张&#xff0c;以下是一些有效的方法&#xff1a; 1.充分准备&#xff1a; 深入了解公司背景、职位要求以及公司文化…...

编程日记 2024/10/20 5:22:53

即时通讯未读消息计数

单聊未读消息计数 未读消息的计数&#xff0c;分为两个部分&#xff1a;增加和减少 其中&#xff0c;未读消息计数的增加&#xff0c;是由数据库&#xff08;redis&#xff09;在写入消息的同时&#xff0c;增加对应接收方的未读消息计数 在线 用户在线时&#xff0c;客户端…...

编程日记 2024/10/20 5:21:53

在Openshift（K8S）上通过EMQX Operator部署Emqx集群

EMQX Operator 简介 EMQX Broker/Enterprise 是一个云原生的 MQTT 消息中间件。 我们提供了 EMQX Kubernetes Operator 来帮助您在 Kubernetes 的环境上快速创建和管理 EMQX Broker/Enterprise 集群。 它可以大大简化部署和管理 EMQX 集群的流程&#xff0c;对于管理和配置的知…...

编程日记 2024/10/20 5:18:48

Python酷玩之旅_数据分析入门（matplotlib）

导览 前言matplotlib入门1. 简介1.1 Pairwise data1.2 Statistical distributions1.3 Gridded data1.4 Irregularly gridded data1.5 3D and volumetric data 2. 实践2.1 安装2.2 示例 结语系列回顾 前言 翻看日历&#xff0c;今年的日子已划到了2024年10月19日&#xff0c;今天…...

编程日记 2024/10/20 5:17:41

uiautomatorviewer安卓9以上正常使用及问题处理

一、安卓9以上使用uiautomatorviewer问题现象 打开Unexpected error while obtaining UI hierarchy 问题详情 Unexpected error while obtaining UI hierarchy java.lang.reflect.InvocationTargetException 二、问题处理 需要的是替换对应D:\software\android-sdk-windows…...

编程日记 2024/10/20 5:15:39

Go语言gRPC快速入门

文章目录 前言gRPC是什么Go语言的gRPC技术栈准备工作接口定义代码生成服务端代码编写客户端代码编写效果演示完整代码链接最后 前言 你好&#xff0c;我是醉墨居士&#xff0c;这篇博客想帮助初学者能够快速入门gRPC&#xff0c;希望能够为你节省宝贵的时间&#xff0c;让时间…...

编程日记 2024/10/20 5:13:37

Golang | Leetcode Golang题解之第479题最大回文数乘积

题目&#xff1a; 题解&#xff1a; func largestPalindrome(n int) int {if n 1 {return 9}upper : int(math.Pow10(n)) - 1for left : upper; ; left-- { // 枚举回文数的左半部分p : leftfor x : left; x > 0; x / 10 {p p*10 x%10 // 翻转左半部分到其自身末尾&…...

编程日记 2024/10/20 5:12:36

UDP协议讲解

预备知识&#xff1a; 端口号port&#xff1a; 我们在正常网络通信时&#xff0c;实际上是进程在互相通信。 我们所有的网络通信的行为&#xff0c;本质上都是进程间通信。 对双方而言&#xff0c;1.先保证数据能到达自己的机器 ip解决 2.找到指定的进程 端口号 ip地址用来…...

编程日记 2024/10/20 5:09:33

交叉注意力融合时域、频域特征的FFT + CNN -BiLSTM-CrossAttention轴承故障识别模型

往期精彩内容&#xff1a; Python-凯斯西储大学&#xff08;CWRU&#xff09;轴承数据解读与分类处理 Pytorch-LSTM轴承故障一维信号分类(一)-CSDN博客 Pytorch-CNN轴承故障一维信号分类(二)-CSDN博客 Pytorch-Transformer轴承故障一维信号分类(三)-CSDN博客 三十多个开源…...

编程日记 2024/10/20 5:07:32