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

css面试常考布局（圣杯布局、双飞翼布局、三栏布局、两栏布局、三角形）

news 来源：原创 2025/6/18 3:36:19

两栏布局

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body><!-- flex实现 --><div style="display: flex;height:100%"><div style="background-color: red;width:100px;%">1</div><div style="background-color: blue;flex:1 0 0">2</div></div><!-- grid实现 --><div style="display: grid;width:100vw;grid-template-columns:200px auto"><div style="background-color: green;">1</div><div style="background-color: black;">2</div></div>f <!-- float实现 --><div><div style="float: left;background-color:chocolate;width:100px">1</div><!-- margin-left使得内容不会占据左侧高度 --><div style="background-color: yellow;margin-left:100px">2</div></div>
</body>
</html>

三栏布局

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head><body><div style="display: flex;"><div style="background: red;width:100px">1</div><div style="flex:1;background: yellow;">2</div><div style="width:100px;background: blue;">3</div></div><div style="display: grid;grid-template-columns:100px 1fr 100px"><div style="background:green">1</div><div style="background:black">2</div><div style="background:red"> 3</div></div><div style="margin-top: 100px;"><div style="background:green;float:left;width:100px">1</div><div style="background:red;float:right;width:100px"> 3</div><!-- 中间一栏必须放到最后 --><!-- 如何放到中间，会导致float:right换行 --><div style="background:yellow;margin-left:100px;margin-right:100px">2</div></div>
</body></html>

圣杯布局

圣杯布局要求
  • header和footer各自占领屏幕所有宽度，高度固定。
  • 中间的container是一个三栏布局。三栏布局两侧宽度固定不变，中间部分自动填充整个区域。
  • 中间部分的高度是三栏中最高的区域的高度。
  • 中间部分最先渲染

因为中间部分最先渲染，就需要把中间部分写在html中左右前面

左侧的栏目偏移量等于 right偏移自身元素+margin-left：-100%(父元素的大小)

<!DOCTYPE html>
<html>
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta http-equiv="X-UA-Compatible" content="ie=edge"><title>圣杯布局</title></head><body><style>#header {width: 100vw;background-color: red;}#middle {padding: 0 100px;overflow: hidden;}.column {float: left;}#center {background-color: pink;width: 100%;}#left {background-color: blue;margin-left: -100%;position: relative;width: 100px;right: 100px}#right {background-color: green;margin-right: -100px;width: 100px;}#footer {width: 100vw;background-color: yellow;}</style><div id="header">header</div><div id="middle"><div id="center" class="column">center</div><div id="left" class="column">left</div><div id="right" class="column">right</div></div><div id="footer">footer</div>
</body></html>

对于margin左右两边设置负责可以参考以下

可以看到，设置 margin-right 负值后，橙色方块 自身不动，但其右边的灰色方块 向左偏移

#container{display: flex;
}#left{margin-right: -20px;
}

img

设置负值的现象
margin-left自身向左移动
margin-top自身向上移动
margin-right自身不动，其右边元素向左移动
margin-bottom自身不动，其下方元素向上移动

双飞翼布局

  • 中间的container是一个三栏布局。
  • 三栏布局两侧宽度固定不变，中间部分自动填充整个区域。
  • 中间部分的高度是三栏中最高的区域的高度。
  • 中间部分的背景包括左右两边
  • 中间部分的内容最先渲染

所以和三栏布局的最大不同就是中间部分要在最前面

大体实现和圣杯布局差不多，主要就是使用padding限制中间盒子的内容，圣杯布局使用margin限制和两边盒子的距离

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head><body><div><div style="background:blue;float: left;width:100%"><!-- div的content会被覆盖掉 --><div style="padding: 0 100px;">main</div></div><!-- 整个元素偏移 --><div style="width:100px;float:left;background:red;margin-left:-100%">22222</div><div style="float: left;background:yellow;width:100px;margin-left:-100px">3</div></div>
</body></html>

css三角形

CSS绘制三角形主要用到的是border属性，也就是边框。

平时在给盒子设置边框时，往往都设置很窄，就可能误以为边框是由矩形组成的。实际上，border属性是右三角形组成的，下面看一个例子：

div {width: 0;height: 0;border: 100px solid;border-color: orange blue red green;
}

将元素的长宽都设置为0，显示出来的效果是这样的： img 所以可以根据border这个特性来绘制三角形：

div {    width: 0;  height: 0;   border-left: 50px solid red;  border-top: 50px solid transparent; //透明border-bottom: 50px solid transparent;//透明
}

在这里插入图片描述

为什么需要 border-top 和 border-bottom？

  • 形成三角形的斜边：
    • 当你设置了 border-left 为有颜色（比如红色）的边框时，它会成为三角形的一个直角边。
    • 通过设置 **透明的 border-top** 和 border-bottom，这两个透明的边框会让整个元素看起来像是一个“尖锐的顶端”，从而形成一个三角形的外观。
  • 保持元素的比例：
    • 如果只有 border-left 而没有上下透明的边框，元素本身不会有高度，只有边框的颜色会显示出来。没有透明的上下边框，红色的左边框会被压缩或拉伸，无法形成一个完整的三角形形状。

相关文章：

css面试常考布局（圣杯布局、双飞翼布局、三栏布局、两栏布局、三角形）

两栏布局 <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><meta name"viewport" content"widthdevice-width, initial-scale1.0"><title>Document</title> </head> &…...

编程日记 2025/5/30 22:03:41

【物流管理系统 - IDEAJavaSwingMySQL】基于Java实现的物流管理系统导入IDEA教程

有问题请留言或私信 步骤 下载项目源码&#xff1a;项目源码 解压项目源码到本地 打开IDEA 左上角&#xff1a;文件 → 新建 → 来自现有源代码的项目 找到解压在本地的项目源代码文件&#xff0c;点击确定&#xff0c;根据图示步骤继续导入项目 查看项目目录&#xff…...

编程日记 2025/5/31 10:27:59

IntelliJ IDEA 主题插件

在 IntelliJ IDEA 中&#xff0c;有很多优秀的主题插件可以帮助你改变 IDE 的外观和配色方案&#xff0c;使得开发过程更加愉悦和高效。以下是一些非常受欢迎和实用的 主题插件&#xff0c;以及如何安装和使用它们的步骤&#xff1a; &#x1f31f; 流行主题插件推荐 1️⃣ Ma…...

编程日记 2025/6/2 10:39:35

ASP.NET Core 中，Cookie 认证在集群环境下的应用

在 ASP.NET Core 中&#xff0c;Cookie 认证在集群环境下的应用通常会遇到一些挑战。主要的问题是 Cookie 存储在客户端的浏览器中&#xff0c;而认证信息&#xff08;比如 Session 或身份令牌&#xff09;通常是保存在 Cookie 中&#xff0c;多个应用实例需要共享这些 Cookie …...

编程日记 2025/6/3 10:38:04

k8s笔记29--使用kyverno提高运维效率

k8s笔记29--使用kyverno提高运维效率 介绍原理安装应用场景自动修正测试环境pod资源强制 Pod 标签限制容器镜像来源禁止特权容器其它潜在场景 注意事项说明 介绍 Kyverno是一个云原生的策略引擎&#xff0c;它最初是为k8s构建的&#xff0c;现在也可以在k8s集群之外用作统一的…...

编程日记 2025/5/28 20:41:02

快速上手Git——Windows系统下Git的安装与简单使用流程

一、Git的下载和安装 Git官网链接&#xff1a;https://git-scm.com/ 进入官网后选择Downloads 选择与系统相符合的版本下载&#xff0c;这里我使用的是windows系统 然后点击下载 根据流程安装完成后&#xff0c;使用以下命令查看git版本 git -v运行结果&#xff1a; 二、…...

编程日记 2025/6/4 14:57:58

apollo内置eureka dashboard授权登录

要确保访问Eureka Server时要求输入账户和密码&#xff0c;需要确保以下几点&#xff1a; 确保 eurekaSecurityEnabled 配置为 true&#xff1a;这个配置项控制是否启用Eureka的安全认证。如果它被设置为 false&#xff0c;即使配置了用户名和密码&#xff0c;也不会启用安全认…...

编程日记 2025/6/4 1:20:52

linux--防火墙 iptables 双网卡 NAT 桥接

linux--防火墙 iptables 双网卡 NAT 桥接 1 介绍1.1 概述1.2 iptables 的结构 2 四表五链2.1 iptables 的四表filter 表&#xff1a;过滤规则表&#xff0c;默认表。nat 表&#xff1a;地址转换表。mangle 表&#xff1a;修改数据包内容。raw 表&#xff1a;原始数据包表。 2.2…...

编程日记 2025/6/4 10:48:21

C#反射的应用案例与讲解

C# 反射 文章目录 C# 反射前言案例展示将对象转为字典测试用例执行效果代码讲解 HasValue扩展测试用例执行效果代码讲解 反射的底层逻辑反射的原理反射的基本概念反射常用的API和方法GetType类Activator类PropertyInfo类EventInfo 类MemberInfo类MethodInfo类 反射的优缺点优点…...

编程日记 2025/6/2 23:41:52

Mysql常见知识点

Mysql是最常用的数据库了。 1、什么是关系型数据库&#xff1f; 关系型数据库&#xff08;RDB&#xff0c;Relational Database&#xff09;就是一种建立在关系模型的基础上的数据库。关系模型表明了数据库中所存储的数据之间的联系&#xff08;一对一、一对多、多对多&#…...

编程日记 2025/6/4 14:27:45

玩转 JMeter：Random Order Controller让测试“乱”出花样

嘿&#xff0c;各位性能测试的小伙伴们&#xff01;今天咱要来唠唠 JMeter 里超级有趣又超实用的 Random Order Controller&#xff08;随机顺序控制器&#xff09;&#xff0c;它就像是性能测试这场大戏里的“魔术棒”&#xff0c;轻轻一挥&#xff0c;就能让测试场景变得千变…...

编程日记 2025/5/28 10:17:16

企业级PHP异步RabbitMQ协程版客户端 2.0 正式发布

概述 workerman/rabbitmq 是一个异步RabbitMQ客户端&#xff0c;使用AMQP协议。 RabbitMQ是一个基于AMQP&#xff08;高级消息队列协议&#xff09;实现的开源消息组件&#xff0c;它主要用于在分布式系统中存储和转发消息。RabbitMQ由高性能、高可用以及高扩展性出名的Erlan…...

编程日记 2025/5/29 14:50:45

计算机网络 （37）TCP的流量控制

前言 计算机网络中的TCP&#xff08;传输控制协议&#xff09;流量控制是一种重要机制&#xff0c;用于确保数据在发送方和接收方之间的传输既高效又稳定。 一、目的 TCP流量控制的主要目的是防止发送方发送数据过快&#xff0c;导致接收方无法及时处理&#xff0c;从而引起数据…...

编程日记 2025/6/1 10:45:59

Windows10下安装vue2.0项目所需环境

一、Node.js版本管理器NVM安装 1.下载NVM安装包 nvm全英文也叫node.js version management&#xff0c;是一个nodejs的版本管理工具。nvm和n都是node.js版本管理工具&#xff0c;为了解决node.js各种版本存在不兼容现象可以通过它可以安装和切换不同版本的node.js。目前最新版…...

编程日记 2025/5/29 21:41:02

使用Cilium/eBPF实现大规模云原生网络和安全

大家读完觉得有帮助记得关注和点赞&#xff01;&#xff01;&#xff01; 目录 抽象 1 Trip.com 云基础设施 1.1 分层架构 1.2 更多细节 2 纤毛在 Trip.com 2.1 推出时间表 2.2 自定义 2.3 优化和调整 2.3.1 解耦安装 2.3.2 避免重试/重启风暴 2.3.3 稳定性优先 2…...

编程日记 2025/6/1 10:32:08

SQL美化器优化

文章目录 1.目录2.代码 1.目录 2.代码 package com.sunxiansheng.mybatis.plus.inteceptor;import org.apache.ibatis.executor.statement.StatementHandler; import org.apache.ibatis.mapping.*; import org.apache.ibatis.plugin.*; import org.apache.ibatis.reflection.*…...

编程日记 2025/6/4 4:08:30

网络基础1 http1.0 1.1 http/2的演进史

http1.0 1.1 http/2的演进史&#x1f60e; &#xff08;连接复用 队头阻塞 服务器推送 2进制分帧&#xff09; 概述 我们主要关注的是应用层 传输层 http协议发展历史 http的报文结构&#xff1a;起始行 Header Body http的典型特征 http存在的典型问题 Keep Alive机制 chun…...

编程日记 2025/6/4 13:54:21

MySQL不使用子查询的原因

MySQL不使用子查询的原因及优化案例 目录 MySQL不使用子查询的原因及优化案例 目录不推荐使用子查询和JOIN的原因解决方案优化案例 案例1&#xff1a;查询所有有库存的商品信息案例2&#xff1a;使用EXISTS优化子查询案例3&#xff1a;使用JOIN代替子查询案例4&#xff1a;优化…...

编程日记 2025/5/30 10:39:09

网络编程（1）

网络编程概述 Java是 Internet 上的语言&#xff0c;它从语言级上提供了对网络应用程序的支持&#xff0c;程序员能够很容易开发常见的网络应用程序。 Java提供的网络类库&#xff0c;可以实现无痛的网络连接&#xff0c;联网的底层细节被隐藏在 Java 的本机安装系统里&#…...

编程日记 2025/6/3 1:23:15

Jaeger UI使用、采集应用API排除特定路径

Jaeger使用 注&#xff1a; Jaeger服务端版本为&#xff1a;jaegertracing/all-in-one-1.6.0 OpenTracing版本为&#xff1a;0.33.0&#xff0c;最后一个版本&#xff0c;停留在May 06, 2019。最好升级到OpenTelemetry。 Jaeger客户端版本为&#xff1a;jaeger-client-1.3.2。…...

编程日记 2025/6/3 8:14:43

【python:文件-＞统计飞鸟集单词个数】

主函数.py fopen("飞鸟集.txt",r,encoding"UTF-8")#只读方式打开 contentf.read()# 提取全文,将文件内容字符串对象返回给content dccontent.split("\n")#对字符串调用分割符切割 print(dc) f.close() # 统计单词频率 ofnumcontent.count("…...

编程日记 2025/5/30 5:02:06

解决SpringBoot无法使用JDK8问题

解决SpringBoot无法使用JDK8问题 现状解决方案 现状 使用idea创建springboot项目无法选择java8。原因是23年11月的spring更新后就明确了不在支持java8版本的项目创建&#xff0c;但是目前为止很多公司开发还在用java8&#xff0c;导致会有问题的产生。 解决方案 使用idea创…...

编程日记 2025/5/27 1:12:38

论文导读 | 数据库系统中基于机器学习的基数估计方法

背景 基数估计任务是在一个查询执行之前预测其基数&#xff0c;基于代价的查询优化器&#xff08;Cost Based Optimizer&#xff09;将枚举所有可能的执行计划&#xff0c;并利用估计的基数选出期望执行代价最小的计划&#xff0c;从而完成查询优化的任务。 然而&#xff0c;…...

编程日记 2025/6/3 23:23:22

Shader-＞LinearGradient线性渐变着色器详解

XML文件 <com.example.myapplication.MyViewxmlns:android"http://schemas.android.com/apk/res/android"android:layout_width"match_parent"android:layout_gravity"center"android:layout_height"400dp"/>自定义View代码 c…...

编程日记 2025/6/3 16:33:05

Unity打包+摄像机组件

转换场景 使用程序集&#xff1a;using UnityEngine.SceneManagement; 切换场景相关代码&#xff1a;SceneManager.LoadScene(1);//括号内可放入场景名称&#xff0c;场景索引等 //Application.LoadLevel(""); 老版本Unity加载场景方法 打包相关 Bundle Identi…...

编程日记 2025/6/3 6:30:28

Git 命令代码管理详解

一、Git 初相识&#xff1a;版本控制的神器 在当今的软件开发领域&#xff0c;版本控制如同基石般重要&#xff0c;而 Git 无疑是其中最耀眼的明珠。它由 Linus Torvalds 在 2005 年创造&#xff0c;最初是为了更好地管理 Linux 内核源代码。随着时间的推移&#xff0c;Git 凭借…...

编程日记 2025/5/31 18:26:11

游戏引擎学习第78天

Blackboard: Position ! Collision “网格” 昨天想到的一个点&#xff0c;可能本来就应该想到&#xff0c;但有时反而不立即思考这些问题也能带来一些好处。节目是周期性的&#xff0c;每天不需要全程关注&#xff0c;通常只是在晚上思考&#xff0c;因此有时我们可能不能那么…...

编程日记 2025/6/3 15:00:33

Centos9-SSH免密登录配置-修改22端口-关闭密码登录-提高安全性

Centos9-SSH免密登录配置-修改22端口-关闭密码登录 生成秘钥对将公钥信息存进authorized_keys测试登录查询访问记录、比对指纹更换22访问端口关闭账号密码登录生成秘钥对 生成密钥对，指定 备注 和 文件目录命令执行后，默认两次回车，不设置秘钥使用密码ssh-keygen -t rsa -b …...

编程日记 2025/5/29 23:11:12

汇总统计数据--SQL中聚集函数的使用

目录 1、为什么需要汇总数据 2、聚集函数 &#xff08;1&#xff09;AVG函数 &#xff08;2&#xff09;COUNT函数 &#xff08;3&#xff09;MAX和MIN函数 &#xff08;4&#xff09;SUM函数 3、聚集不同值--DISTINCT 4、组合聚集函数 5、小结 博主用的是mysql8 DBMS…...

编程日记 2025/6/3 10:36:50

pdf提取文本，表格以及转图片：spire.pdf

文章目录 &#x1f412;个人主页&#xff1a;信计2102罗铠威&#x1f3c5;JavaEE系列专栏&#x1f4d6;前言&#xff1a;&#x1f380; 1. pdfbox1.1导入pdfbox 的maven依赖1.1 提取文本1.2 提取文本表格&#xff08;可自行加入逻辑处理&#xff09;1.3 pdf转换成图片代码&…...

编程日记 2025/6/2 2:12:19

【C#学习笔记】C#中委托

概述 C#的委托是一种类型安全的函数指针&#xff0c;用于引用方法&#xff0c;委托允许方法作为参数传递&#xff0c;或者将方法赋值给委托变量&#xff0c;并通过委托调用方法。 委托类型&#xff1a;委托定义了方法的的签名&#xff08;[方法的参数类型和返回值]&#xff0…...

编程日记 2025/6/4 14:29:07

C#的Task

优先使用Task.Run&#xff0c;除非有定制化需求才用Task.Factory.StartNew Task.Factory.StartNew的TaskScheduler参数颠覆你的认知&#xff1a; var cnt 0;var cancelToken new CancellationTokenSource();await Task.Factory.StartNew(() > {cnt;Debug.WriteLine($&quo…...

编程日记 2025/6/3 10:07:05

企业全文搜索-搜索权限，非侵入文档同步，权限同步 ，扩展字段

简介 企业全文搜索帮助员工高效快速定位所需的信息和资源，搜索权限控制是必须的，原因有二，首先，企业文档，包括公文，流程，技术文档等，带有敏感信息，搜索返回带片段，可能带出敏感信息；其次，若没有权限，用户搜索出来的文档可能不能阅读原文，体验非常差。onesearch有…...

编程日记 2025/5/31 15:04:34

Linux电源管理——CPUidle Framework

目录 前言 一、CPU idle 二、cpuidle framework 相关概念 三、cpuidle core 数据结构 3.1、cpuidle_state 3.2、cpuidle_driver 3.3、cpuidle_device 3.4、cpuidle_governor 四、cpuidle driver初始化流程 4.1、cpuidle driver 初始化方式 4.2、drv->states[0]的初…...

编程日记 2025/6/3 22:47:58

【黑灰产】假钱包推广套路

假钱包推广产业链研究 市面上钱包的主要推广方式&#xff1a; 1&#xff0c;竞价&#xff08;搜索引擎&#xff09;&#xff0c;误导客户为真正官方钱包从而完成下载使用 优点&#xff1a;精准&#xff0c;客户大 缺点&#xff1a;竞价户容易挂&#xff0c;投资大 2&#xff0…...

编程日记 2025/5/28 3:12:57

联想java开发面试题及参考答案

IP 协议是哪一层的？ IP 协议（Internet Protocol）属于网络层协议。 网络层主要负责将数据从源节点传输到目标节点，它在整个网络通信体系中起到了承上启下的关键作用。在分层网络模型中，下层（如数据链路层）为网络层提供物理链路的连接和帧传输服务。数据链路层关注的是在相…...

编程日记 2025/6/2 19:15:07

C# 继承(接口)

接口 如果一个类派生与一个接口&#xff0c;它就会执行某些函数。并不是所有的面向对象语言都支持接口。 熟悉COM的开发人员应注意&#xff0c;尽管在概念上C#接口类似于COM接口&#xff0c;但他们是不筒的&#xff0c;底层的结构不筒。比如&#xff0c;C#接口并不派生于IUnko…...

编程日记 2025/5/31 14:49:20

FPGA的 基本结构（Xilinx 公司Virtex-II 系列FPGA ）

以Xilinx 公司Virtex-II 系列FPGA 为例&#xff0c;其基本结构由下图所示。它是主要由两大部分组成&#xff1a;可编程输入/输出&#xff08;Programmable I/Os&#xff09;部分和内部可配置&#xff08;Configurable Logic&#xff09;部分。 可编程输入/输出&#xff08;I/Os…...

编程日记 2025/5/31 1:03:56

妙用编辑器：把EverEdit打造成一个编程学习小环境

1 妙用编辑器&#xff1a;把EverEdit打造成一个编程学习小环境 1.1 应用场景 最近在学习Python语言&#xff0c;由于只是学习和练习&#xff0c;代码规模很小&#xff0c;不想惊动PyCharm、VSCode、WingIDE这些重型武器&#xff0c;只想轻快的敲些代码&#xff0c;记事本虽好&…...

编程日记 2025/6/3 10:19:46

ELK日志分析实战宝典之ElasticSearch从入门到服务器部署与应用

目录 ELK工作原理展示图 一、ElasticSearch介绍&#xff08;数据搜索和分析&#xff09; 1.1、特点 1.2、数据组织方式 1.3、特点和优势 1.3.1、分布式架构 1.3.2、强大的搜索功能 1.3.3、数据处理与分析 1.3.4、多数据类型支持 1.3.5、易用性与生态系统 1.3.6、高性…...

编程日记 2025/6/2 20:34:46

【学习笔记】理解深度学习和机器学习的数学基础：数值计算

深度学习作为人工智能领域的一个重要分支&#xff0c;其算法的实现和优化离不开数值计算。数值计算在深度学习中扮演着至关重要的角色&#xff0c;它涉及到如何在计算机上高效、准确地解决数学问题。本文将介绍深度学习中数值计算的一些关键概念和挑战&#xff0c;以及如何应对…...

编程日记 2025/6/3 19:56:32

【Java回顾】Day5 并发基础|并发关键字|JUC全局观|JUC原子类

JUC全称java.util.concurrent 处理并发的工具包(线程管理、同步、协调) 一.并发基础 多线程要解决什么问题&#xff1f;本质是什么&#xff1f; CPU、内存、I/O的速度是有极大差异的&#xff0c;为了合理利用CPU的高性能&#xff0c;平衡三者的速度差异&#xff0c;解决办法…...

编程日记 2025/6/3 6:41:02

VSCODE使用Echarts组件库(不是vue)

第一步打开Echarts官网 Examples - Apache ECharts 第二步随便点击一个图形点击我圈的按钮 第三步...

编程日记 2025/5/15 19:21:10

DNS解析域名简记

域名通常是由: 权威域名.顶级域名.根域名组成的。 从左往右&#xff0c;级别依次升高&#xff0c;这和外国人从小范围到大范围的说话习惯相关。&#xff08;我们自己是更习惯先说大范围再说小范围&#xff0c;如XX省XX市XX区XX路&#xff09; DNS解析域名时&#xff0c;会先查…...

编程日记 2025/6/3 2:11:47

选择器css

1.a标签选择 // 选中所具有herf 的元素 [herf] {color: skyblue; } // 选中所具有herfhttps://fanyi.youdao.com/ 的元素 [herf$"youdao.com"] {color:pink; } // 按此顺序书写 link visited hover active // 未访问状态 a:link {color:orange } // 访问状态 a…...

编程日记 2025/5/28 23:00:45

9.4 visualStudio 2022 配置 cuda 和 torch (c++)

一、配置torch 1.Libtorch下载 该内容看了【Libtorch 一】libtorchwin10环境配置_vsixtorch-CSDN博客的博客&#xff0c;作为笔记用。我自己搭建后可以正常运行。 下载地址为windows系统下各种LibTorch下载地址_libtorch 百度云-CSDN博客 下载解压后的目录为&#xff1a; 2.vs…...

编程日记 2025/6/2 10:33:51

ASP.NET Core 实现微服务 -- Polly 服务降级熔断

在我们实施微服务之后&#xff0c;服务间的调用变的异常频繁。多个服务之间可能是互相依赖的关系。某个服务出现故障或者是服务间的网络出现故障都会造成服务调用的失败&#xff0c;进而影响到某个业务服务处理失败。某一个服务调用失败轻则造成当前相关业务无法处理&#xff1…...

编程日记 2025/6/4 14:29:59

2_CSS3 背景 --[CSS3 进阶之路]

CSS3 中的背景属性提供了许多强大的功能来增强网页设计&#xff0c;包括但不限于多背景图像、渐变、背景大小控制等。以下是一些关键的 CSS3 背景属性及其用法示例。 1. 多重背景图像 CSS3 允许你为一个元素设置多个背景图像。这些图像按照它们在 background-image 属性中定义…...

编程日记 2025/6/2 10:36:46

于交错的路径间：分支结构与逻辑判断的思维协奏

大家好啊&#xff0c;我是小象٩(๑ω๑)۶ 我的博客&#xff1a;Xiao Xiangζั͡ޓއއ 很高兴见到大家&#xff0c;希望能够和大家一起交流学习&#xff0c;共同进步。* 这一节内容很多&#xff0c;文章字数达到了史无前例的一万一&#xff0c;我们要来学习分支与循环结构中…...

编程日记 2025/6/1 13:39:51

升级 CentOS 7.x 系统内核到 4.4 版本

问题描述 在 CentOS 7.x 系统中&#xff0c;默认内核版本是 3.10.x&#xff0c;这个版本可能会带来一些与 Docker 和 Kubernetes 兼容性的问题&#xff0c;导致系统性能不稳定或功能异常。为了提高系统的稳定性和兼容性&#xff0c;建议升级到更高版本的内核&#xff0c;例如 …...

编程日记 2025/6/1 9:55:33