CSS进阶空间转换和 less
<html>
<head>
<meta charset="UTF-8" />
<title>空间转换</title>
</head>
<body>
<!-- 空间转换
空间：是从坐标轴角度定义的X,Y,和Z三条坐标轴构成一个立体空间 Z轴位置与视线方向相同
空间转换也叫3D转换
属性：transform
-->
<!-- 空间转换 -平移
属性：
transform：translate3d(x,y,z);
transform: translateX();
transform: translateY();
transform: translateZ();
取值（正负均可）
像素单位数值
百分比（参照盒子自身尺寸计算结果）
电脑是平面的，默认情况下无法观察到 Z 轴平移的效果
-->
<!-- 视距perspective
作用：指定了观察者与Z=0平面的距离，为元素添加透视效果
透视效果：近大远小，近实远虚
属性：（添加给父级，取值范围800-1200）
perspective：视距;
-->
<!-- 空间旋转
transform:rotateZ（值）;
transform:rotateX (值);
transform:rotateY (值);
左手法制：根据旋转方向确定取值正负
左手握住旋转轴，拇指指向正值方向，其他四个手指弯曲方向为旋转轴正值方向
自定义旋转轴：
rotate3d（x,y,z）:用来自定义旋转轴的位置及旋转的角度
x,y,z取值为0-1之间的数字
-->
<!-- 立体呈现 transform-style
作用：设置元素的子元素是位于3D空间中还是平面中
属性名：transform-style（给父级加）
属性值：flat：子级处于平面中
preserve-3d：子级处于3D空间
注意：每个面都有独立的坐标轴
-->
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>less</title>
</head>
<body>
<!-- less是一个css与处理器，文件后缀是.less，使css具备一定的逻辑性，计算能力
注意：浏览器不识别less代码，目前阶段网页要引入对应的css文件
cscode插件：easy less保存less文件自动生成对应的css文件 -->
<!-- less-注释
单行注释
语法：//注释内容
快捷键：ctrl+/
块注释
语法：/*注释内容*/
快捷键：shift+alt+a -->
<!-- less运算
加、减、乘、直接书写计算表达式
除法需要添加小括号或. -->
<!-- less - 嵌套
作用：快速生成后代选择器
·father｛
color：red；
.son｛
width：200px；
a｛
color：green
//&表示的是当前选择器，代码写到谁的大括号里面就表示谁不会生成后代选择器
应用：配合hover伪类或nth-child结构伪类使用
&：hover｛color：blue
｝
｝｝｝ -->
<!-- less - 变量
概念：容器，存储数据
作用：存储数据，方便使用和修改
语法：
定义变量：@变量名：数据；
使用变量：css属性：@变量名；
-->
<!-- less-导入
作用：导入less公共样式文件
语法：导入@import“文件路径”
提示：如果是less文件可以省略后缀
@import‘./base.less’；
@import‘/common’；
-->
<!-- less - 导出
写法：在less文件的第一行添加//out：存储url
提示：文件夹名称后面添加/
//out：./css/
指定文件夹
// out：./index.css
生成对应的css
//out：.mycss/index.css
在mycss文件中生成index.css
禁止导出
写法：在文件第一行//out：false
-->
</body>
</html>
相关文章：
CSS进阶空间转换和 less
<html> <head> <meta charset"UTF-8" /> <title>空间转换</title> </head> <body> <!-- 空间转换 空间：是从坐标轴角度定义的X,Y,和Z三条坐标轴构成一个立体空间 Z轴位置与视线方向相同 空间转换也叫3D转…...
C/C++ 知识点：| 与 || 的区别
文章目录 一、|与 || 的区别1、按位或运算符 |2、逻辑或运算符 ||3、区别4、总结 前言 在C编程语言中，逻辑或运算符用于连接两个条件表达式，当至少有一个条件为真时，整个表达式的结果为真。C提供了两种逻辑或运算符：按位或|和逻辑…...
CSS中如何设置单行或多行内容超出后，显示省略号
1. 设置超出显示省略号 css设置超出显示省略号可分两种情况： 单行文本溢出显示省略号…多行文本溢出显示省略号… 但使用的核心代码是一样的：需要先使用 overflow:hidden;来把超出的部分隐藏，然后使用text-overflow:ellipsis;当文本超出时…...
PFA烧杯透明聚四氟乙烯刻度量杯
PFA烧杯，刻度清晰，耐酸碱，和有机溶剂。...
Redis底层数据结构之String
文章目录 1. 前提回顾2. RedisObject三大数据类型简介3. SDS字符串4. SDS字符串源码分析5. 总结 1. 前提回顾 前面我们说到redis的String数据结构在底层有多种编码方式。例如我们执行下面两条语句 set k1 v1 set age 17我们查看类型，发现这类型都是String类型 我们…...
【Maven学习笔记】Maven入门教程（适合新手反复观看学习）
Maven学习笔记 Maven的简要介绍Maven的安装和配置Maven的安装Maven安装的常用配置 Maven的使用入门编写pom编写主代码编写测试代码打包和运行使用Archetype生成项目骨架 Maven核心概念的阐述坐标案例分析依赖依赖的范围传递性依赖依赖范围依赖调节可选依赖Maven依赖常用的技巧 …...
idea Springboot 在线考试管理系统开发mysql数据库web结构java编程计算机网页
一、源码特点 springboot 在线考试管理系统是一套完善的完整信息系统，结合mvc框架和bootstrap完成本系统springboot spring mybatis ，对理解JSP java编程开发语言有帮助系统采用springboot框架（MVC模式开发），系统具有…...
Spring Cloud Alibab 入门搭建，包含Nacos中心，注册服务发现服务，Feign请求，GateWay网关，sentinel限流
源码在最后 一、安装Nacos注册中心 1.1查看Nacos官网，安装Nacos服务，下载源码或者安装包 1.2启动服务，默认端口为8848， 二、创建服务注册&发现 2.1使用脚手架，创建注册服务和发现服务项目，我用的版…...
ShardingSphere-SQL 解析 Issue 处理流程
ShardingSphere-SQL 解析 Issue 处理流程 这是之前给社区写的 SQL 解析 Issue 的处理流程，可以帮助社区用户快速参与到 ShardingSphere-SQL 解析任务当中。 ShardingSphere SQL 解析 issue 列表 Issue 背景说明 当前 Issue 使用自定义的爬虫脚本从对应的数据库官…...
【矩阵】48. 旋转图像【中等】
旋转图像 给定一个 n n 的二维矩阵 matrix 表示一个图像。请你将图像顺时针旋转 90 度。你必须在 原地 旋转图像，这意味着你需要直接修改输入的二维矩阵。请不要 使用另一个矩阵来旋转图像。 示例 1： 输入：matrix [[1,2,3],[4,5,6],[7,8,…...
高质量 Git 仓库汇总（持续更新，方便查看）
Leetcode https://github.com/kamyu104/LeetCode-Solutions Cmake https://github.com/viva64/pvs-studio-cmake-examples 3D目标检测 Awesome-3D-Object-Detection Awesome-3D-Object-Detection-for-Autonomous-Driving Cuda Code dbscan https://github.com/l3lackc…...
学习笔记-华为IPD转型2020：1，IPD的重要意义
华为产品开发转型：IPD计划 大多数公司发现，当公司大幅增长时，在较小规模上有效的管理实践不再有效。产品开发过程也是如此。随着华为的发展，该公司遇到了产品故障率更高、开发周期更长和研发成本增加等问题。然后，它转…...
【阿里云系列】-基于云效构建部署NodeJS项目到ACK
准备工作 01、编写Dockerfile文件可以根据不同的环境，新建不同的Dockerfile文件，比如Dockerfile-PROD # Deliver the dist folder with NginxFROM nginx:stable-alpine ENV LANGC.UTF-8 ENV TZAsia/ShanghaiCOPY dist/ /usr/share/nginx/html COPY ngi…...
Jmeter入参问题小记
表单入参的时候，这个地方需要勾选，如果不☑️选的话，会提示errorMsg":"Required String parameter code is not present",...
【四 （2）数据可视化之 Matplotlib 常用图表及代码实现 】
目录 文章导航一、介绍二、安装Matplotlib三、导入Matplotlib四、设置可以中文显示四、常用图形1、散点图（Scatter Plot）2.1、线性图（Line Plot）2.2、堆叠折线图2.3、多图例折线图3.1、柱状图/条形图（Bar Chart&#x…...
官网建设的江湖四大流派，一派苦撑、一派完犊子、另外两派搅局。
有人的地方就有江湖，有江湖的地方就有纷争，有纷争地方就有此起彼伏。 说好的，当赚够了钱就退出建站江湖，人就是江湖，怎么退？ 官网建设风起云涌20年，一方倒地，一方揭竿而起ÿ…...
Ubuntu 安装 KVM 虚拟化
1. Ubuntu 安装 KVM 虚拟化 KVM 是 Linux 内核中一个基于 hypervisor 的虚拟化模块，它允许用户在 Linux 操作系统上创建和管理虚拟机。 如果机器的CPU不支持硬件虚拟化扩展，是无法使用KVM(基于内核的虚拟机)直接创建和运行虚拟机的。此时最多只能使用…...
SA3D：基于 NeRF 的三维场景分割方法
Paper: Cen J, Zhou Z, Fang J, et al. Segment anything in 3d with nerfs[J]. Advances in Neural Information Processing Systems, 2024, 36. Introduction: https://jumpat.github.io/SA3D/ Code: https://github.com/Jumpat/SegmentAnythingin3D SA3D 是一种用于 NeRF 表…...
mysql实战开发之 mysql 删除一张表某个字段的sql语句
有一张表, 我需要删除这张表其中的某一个或者某几个字段, 相信大家在日常开发中应该会遇到这种情况, 然后刚好自己接触的项目安装的mysql关闭了允许远程连接的设置, 也就是说不允许使用类似于navicat 等可视化工具连接, 那么就没办法通过可视化工具直接去通过鼠标操作就可以 完…...
Selenium控制已运行的Edge和Chrome浏览器——在线控制 | 人机交互（详细启动步骤和bug记录）
文章目录 前期准备1. 浏览器开启远程控制指令（1）Edge（2）Chrome 2. 执行python代码（1）先启动浏览器后执行代码（2）通过代码启动浏览器（3）Bug问题记录1ÿ…...
.Net框架，除了EF还有很多很多......
文章目录 1. 引言2. Dapper2.1 概述与设计原理2.2 核心功能与代码示例基本查询多映射查询存储过程调用 2.3 性能优化原理2.4 适用场景 3. NHibernate3.1 概述与架构设计3.2 映射配置示例Fluent映射XML映射 3.3 查询示例HQL查询Criteria APILINQ提供程序 3.4 高级特性3.5 适用场…...
Redis相关知识总结（缓存雪崩，缓存穿透，缓存击穿，Redis实现分布式锁，如何保持数据库和缓存一致）
文章目录 1.什么是Redis？2.为什么要使用redis作为mysql的缓存？3.什么是缓存雪崩、缓存穿透、缓存击穿？3.1缓存雪崩3.1.1 大量缓存同时过期3.1.2 Redis宕机 3.2 缓存击穿3.3 缓存穿透3.4 总结 4. 数据库和缓存如何保持一致性5. Redis实现分布式…...
基于当前项目通过npm包形式暴露公共组件
1.package.sjon文件配置 其中xh-flowable就是暴露出去的npm包名 2.创建tpyes文件夹，并新增内容 3.创建package文件夹...
2021-03-15 iview一些问题
1.iview 在使用tree组件时，发现没有set类的方法，只有get，那么要改变tree值，只能遍历treeData，递归修改treeData的checked，发现无法更改，原因在于check模式下，子元素的勾选状态跟父节…...
Keil 中设置 STM32 Flash 和 RAM 地址详解
文章目录 Keil 中设置 STM32 Flash 和 RAM 地址详解一、Flash 和 RAM 配置界面（Target 选项卡）1. IROM1（用于配置 Flash）2. IRAM1（用于配置 RAM）二、链接器设置界面（Linker 选项卡）1. 勾选“Use Memory Layout from Target Dialog”2. 查看链接器参数（如果没有勾选上面…...
C++ 基础特性深度解析
目录 引言 一、命名空间（namespace） C 中的命名空间 与 C 语言的对比 二、缺省参数 C 中的缺省参数 与 C 语言的对比 三、引用（reference） C 中的引用 与 C 语言的对比 四、inline（内联函数…...
如何为服务器生成TLS证书
TLS（Transport Layer Security）证书是确保网络通信安全的重要手段，它通过加密技术保护传输的数据不被窃听和篡改。在服务器上配置TLS证书，可以使用户通过HTTPS协议安全地访问您的网站。本文将详细介绍如何在服务器上生成一个TLS证…...
C++ Visual Studio 2017厂商给的源码没有.sln文件 易兆微芯片下载工具加开机动画下载。
1.先用Visual Studio 2017打开Yichip YC31xx loader.vcxproj，再用Visual Studio 2022打开。再保侟就有.sln文件了。 易兆微芯片下载工具加开机动画下载 ExtraDownloadFile1Info.\logo.bin|0|0|10D2000|0 MFC应用兼容CMD 在BOOL CYichipYC31xxloaderDlg::OnIni…...
高效线程安全的单例模式：Python 中的懒加载与自定义初始化参数
高效线程安全的单例模式：Python 中的懒加载与自定义初始化参数 在软件开发中，单例模式（Singleton Pattern）是一种常见的设计模式，确保一个类仅有一个实例，并提供一个全局访问点。在多线程环境下，实现单例模式时需要注意线程安全问题，以防止多个线程同时创建实例，导致…...
宇树科技，改名了！
提到国内具身智能和机器人领域的代表企业，那宇树科技（Unitree）必须名列其榜。 最近，宇树科技的一项新变动消息在业界引发了不少关注和讨论，即： 宇树向其合作伙伴发布了一封公司名称变更函称，因…...