开局 效果css
CSS设置一个梯形
1、图形 2、代码 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <style> .d{ width:0px; height:100px; border-left:25px solid; border-top ......
弹性布局 flex 的公共的css文件
/* 弹性布局 */ .flex{ display:flex; } .flex1{ flex:1; } .flex-column { flex-direction: column; } .justify-start { justify-content: flex-start; } .justify- ......
css中的::after和::before
先来看一个::before和::after的例子，给一个元素的前后再不添加新的元素的时候增加内容： <view class="info-before">测试before和after</view> .info-before { font-weight: bold; margin: 30px; } .i ......
使用css绘制箭头
使用css也能直接写出箭头符号，这样不用都使用图片能减少打包的大小。下面是一些常用箭头的css写法： // 向上的箭头 <view class="button-up"></view> // css的内容 .button-up { position: relative; padding: 5px; m ......
使用js和css实现选项卡切换
HTML <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link rel=" ......
Vue3实现电商放大镜效果
效果实现： 功能拆解： 左侧滑块跟随鼠标移动 右则大图放大效果实现 鼠标移入控制滑块和大图显示隐藏 滑块跟随鼠标移动 思路：获取到当前的鼠标在盒子内的相对位置（useMouseInElement），控制滑块跟随鼠标移动（left/top） 获取鼠标相对位置 控制滑块跟随移动 有效移动范围内的计算逻辑 ......
CSS隐藏滚动条
code <style> /* 隐藏标准的滚动条 */ html::-webkit-scrollbar { width: 0; } body::-webkit-scrollbar { width: 0; } /* 隐藏 IE 和 Edge 浏览器的滚动条 */ ::-ms-scrollbar { w ......
CSS设置div高度自动全屏
对body和html都设置高度100% html,body { height: 100%; width: 100%; margin: 0 0 0 0; padding: 0 0 0 0; position: relative; } 然后再对div设置100% #app { height: 100%; ......
纯css展示loading加载动画
https://uiverse.io/barisdogansutcu/light-rat-32 <svg viewBox="25 25 50 50"> <circle r="20" cy="50" cx="50"></circle> </svg> svg { width: 3.25em; trans ......
针对start.sh 更有效果启动命令的快捷方式
如果新建一个start.sh ps -ef | grep `ls -1r hot-data-sync*.jar | head -1` | grep -v "grep" | awk "),{print $2}"), NAME=`ls -1r hotwheels-data-sync*.jar | hea ......
可视化学习：CSS transform与仿射变换
在几年前，我就在一些博客中看到关于CSS中transform的分析，讲到它与线性代数中矩阵的关系，但当时由于使用transform比较少，再加上我毕竟是个数学学渣，对数学有点畏难心理，就有点看不下去，所以只是随便扫了两眼，就没有再继续了解了。现在在学习可视化，又遇到了这个点，又说到这是可视化的基础知... ......
css垂直居中
word-wrap: break-word; /*英文的时候需要加上这句，自动换行*/ /*自测了这句话没啥用*/ writing-mode: vertical-rl; /*从左向右 从右向左是 writing-mode: vertical-rl;*/ writing-mode: tb-rl; /* ......
backdrop-filter：为元素后面区域添加图形效果
backdrop-filter：为元素后面区域添加图形效果 该属性可以让你为一个元素后面区域（即背景区域）添加图形效果（如模糊或颜色偏移）。它适用于元素背后的所有元素，为了看到效果，必须使元素或其背景至少部分透明。作用于元素背后的区域所覆盖的所有元素 与filter的区别：filter作用于元素本身 ......
css文本换行设置
文本换行设置 word-wrap word-wrap:normal | break-word; normal：默认值，当一行剩余空间无法容纳下一个字（英文是指单词）时，会换行 break-word：针对英文的文本，这个值可以让一个单词拆分开来换行。 word-break word-break:nor ......
JS+CSS多行文本显示“更多”
本代码展示最多显示3行，每行行高16px，3行总高48px，4行总高64px 当文本行数大于3行，显示“更多” CSS： #CourseDesc { margin-top: 5px; font-size: 12px; position: relative; max-height: 48px; lin ......
法线贴图实现地形模型皱褶、凹凸不平的纹理效果
法线贴图可以通过改变模型表面法线的方向和强度，增强模型的真实感、细节和视觉效果，使得渲染结果更加逼真。它是一种在计算机图形学中常用的技术。 ......
多客户中型企业用 CRM 系统能提升哪些方面？（CRM 系统的优势和效果）
随着中型企业客户关系的不断扩大和发展，高效管理日益庞大的客户群体变得至关重要。CRM管理系统就是管理大量客户，维护客户关系的重要工具。然而，市面上CRM系统太多了，想要快速、准确找到一款适合您业务的CRM系统是一项艰巨的任务。多客户中型企业怎么选择CRM系统比较好？中型企业在选择CRM系统时需要考虑 ......
15.高阶定位-CSS 定位与原生定位
目录 原生定位 css selector 定位 原生定位 官网地址 元素属性定位 组合定位 # ID 定位 driver.find_element_by_android_uiautomator('\ new UiSelector().resourceId("<element-ID>")') # 组合 ......
Parallax.js：实现自适应智能设备方向的视差效果
哈喽！大家好！我是程序视点的小二哥。 今天给大家分享一款功能非常强大的javascript视觉差特效引擎插件：Parallax.js。 Parallax.js简介 Parallax.js是一个简单的，轻量级的视差引擎。你可以将它作为作为jQuery或Zepto插件来使用，也可以以纯JS的方式来使用。 ......
css适配ios状态栏和IOS底部安全区域的样式代码记录
safe-area-inset-left: 安全区域距离左边界的距离safe-area-inset-right: 安全区域距离右边界的距离safe-area-inset-top: 安全区域距离顶部边界的距离safe-area-inset-bottom: 安全区域距离底部边界的距离 css适配ipho ......
微信小程序使用iconfont通过transfonter转化成只有css样式的方式
1. 通过 iconfont 网站选择对应图表加入购物车，然后添加到自己对应项目中，现在至本地。 2. 解压下载到本地的文件 3. 进入 transfonter 后，点击 Add fonts 按钮，将上图中红色框中的文件上传上去，勾选启用 Base64 encode ，点击 Convert 按钮，完 ......
CSS 文字渐变
/实现文字颜色从红到黄的线性渐变效果/ .text { background: linear-gradient(to right, #ff0000, #ffff00); /*设置渐变的方向从左到右 颜色从ff0000到ffff00*/ -webkit-background-clip: text;/* ......
react native 中使用 Expo Haptics 实现长按按钮获得震动反馈效果
一、背景： 项目中有长按按钮开始录音功能，需要在长按开始时添加一次震动反馈以提高用户体验。由于项目使用expo开发，所以找到了 Expo Haptics 库。 二、使用过程： 1. 安装： npx expo install expo-haptics 2. 引入并使用： import * as Hap ......
css3
目录CSS介绍CSS 语法规范css代码风格样式格式书写紧凑格式展开格式样式大小写小写格式（推荐）大写格式样式空格风格css选择器的作用css基础选择器选择器分类标签选择器作用优缺点类选择器语法规范多类名选择器多类名使用方式多类名开发中使用场景id 选择器id 选择器和类选择器的区别通配符选择器基础 ......
42道CSS高频题整理(附答案背诵版)
1、简述CSS3选择器优先级及计算？ CSS的选择器优先级是一个相对复杂的概念，它规定了在一组样式冲突时，哪些样式将被浏览器采纳。选择器优先级是通过一个四位的值来计算的，形式为：[内联样式, ID选择器, 类选择器/属性选择器/伪类, 元素选择器/伪元素]。这四个等级的优先级从左到右递减，左边的优先 ......
css渐变背景，linear-gradient()线性渐变和radial-gradient()径向渐变
1.简单的线性渐变 .layout{ width: 100%; min-height: 100vh; background: linear-gradient(#FFE8E9,rgba(0,0,0,0) 200px); } 2.层叠多层的渐变（左右+上下+背景图） .layout{ width: 10 ......
CSS transition属性
在给定的transition属性中，有三个参数：过渡属性、过渡时间和过渡速度曲线。 过渡属性：all 表示对元素的所有属性进行过渡动画，包括宽度、高度、颜色、位置等。你也可以指定单个属性进行过渡，例如 opacity，表示只对透明度进行过渡动画。 过渡时间：0.3s 表示过渡的持续时间，单位为秒。这 ......
CSS（层叠样式表，Cascading Style Sheets）
CSS（层叠样式表，Cascading Style Sheets）是一种用于描述文档样式和布局的样式表语言。它可以与HTML结合使用，用于控制网页的外观和格式。以下是CSS的主要特点和一些基本概念： 基本概念： 选择器（Selectors）： 选择器是CSS规则的一部分，用于选择要应用样式的HTML ......
Unreal入门，自定义Actor组件实现浮动效果
这里浮动效果主要实现方式是周期性的改变目标的Z轴坐标偏移，SetRelativeLocation或者AddActorWorldOffset都可以实现这个效果 1. 新建用来实现浮动效果的ActorComponent 随便整个名字 双击打开事件图表 在EventTick后面添加一些改变目标位置的节点， ......