实用技巧 技巧css
CSS: offsetWidth offsetHeight clientWidth clientHeight scrollWidth scrollHeight
<!DOCTYPE html> <html lang="en-US"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content= ......
CSS选择器
# 前言 CSS选择器用于选择具体的元素添加CSS样式。记下笔记。 ## 选择器类型 ### 类型选择器（Type selectors） 类型选择器通过结点名称匹配元素。 #### 语法&实例 ```plaintext 结点名称 { 样式声明 } ``` ： // 绑定鼠标事件，当用户移动视角后触发() function bindRayShotEvent() ......
下拉菜单缓慢展开收起的动画过渡效果,vue2 CSS
需求：点击下拉菜单按钮，显示子菜单并有过渡效果 过渡效果：缓慢展开收起 环境：vue2 CSS 分析：子菜单的高度有没有固定，如果子菜单的高度固定，可以设置高的变化添加过渡效果。如果高度不固定设置最大高度的变化添加过渡效果 图片展示： 展开状态 收起状态 实现代码： <template> <div> ......
es6使用小技巧
①模板字符串拼接字符`` `${name}小朋友，欢迎你加入${school}` name和school皆为变量 ②定义变量，使用const和let来代替var，避免变量上升，污染全局变量 ③合并对象：展开运算符 const obj1 = { a: 1, b: 2 }; const obj2 = { ......
CSS默认支持颜色名称列表
详见[The syntax](https://drafts.csswg.org/css-color/#color-syntax)中的[named-color](https://drafts.csswg.org/css-color/#typedef-named-color)。 ``` js /** * ......
简报技巧
简报技巧 s=c^3 capability communication chance 不是自我感觉良好，而是别人认为你做多少，会多少 訂定目的：听完简报前后，思维有所改变，让谁去做什么事 記住Remember 了解Understand 相信Believe 行動action 先讲结论，再讲推论 让老板 ......
HTML <!--...--> 注释 、CSS /*.....*/ 注释 、JS // 、/*.....*/ 注释
<!-- -->是HTML的注释标签,使用 < 和 > 是符合HTML标签语法规则的。 /* */是CSS的注释标签 /* */（注释代码块）、//（注释单行）是JS的注释标签。 ......
深入解析React DnD拖拽原理，轻松掌握拖放技巧！
>我们是[袋鼠云数栈 UED 团队](http://ued.dtstack.cn/)，致力于打造优秀的一站式数据中台产品。我们始终保持工匠精神，探索前端道路，为社区积累并传播经验价值。。 >本文作者：霁明 # 一、背景 ## 1、业务背景 业务中会有一些需要实现拖拽的场景，尤其是偏视觉方向以及移动端 ......
vue+elementUI 搜索栏公共组件封装，封装多搜索条件通用组件，超实用
1、新建BaseSearch.vue文件 <!-- *名称：弹窗的搜索条件组件 *功能：methods 1.点击搜索的方法：@search 2.搜索条件 props : formItemList --> <template> <div class="dialog-search"> <el-form ......
CSS 图片加载提前占位 padding-top、padding-bottom
今天聊一个图片加载提前占位的一个问题 🤔，内容比较适合初学者。 ### 起因 在响应式页面当中，图片加载之前是不知道图片高度的，加载成功图片完全撑开。如果不做提前占位会把下面的内容挤下去，页面出现抖动，就像下面效果一样： ![css-ccupy-no.gif](https://p3-juejin. ......
css 背景色是中心往两侧渐变的半圆 先上下渐变 再中心像左右渐变 也就是 背景从顶部中中心顶点 颜色朝着四面八方渐变成白色
``` {{ t("Login") }} {{ t("welcome") }} Email Password Forgot Password ? Continue Please wait... ``` ``` ``` css 背景色是中心往两侧渐变的半圆 先上下渐变 再中心像左右渐变 也就是 背景从 ......
CSS3 transform
## Transform Transform字面上就是变形，改变的意思。 ``` transform ： none | [ ] ``` ```css transform: rotate | scale | skew | translate |matrix; ``` 旋转rotate、扭曲skew、缩 ......
P8933 [JRKSJ R7] 技巧性的块速递推 题解
因为连续四个格子一定是 2 黑 2 白，所以如果确定了 (i，j) 点任意方向上与其连续的三个点的颜色，就可以推出 (i，j)（即确定的三个中较少的那种颜色）。例如：
上图中第一行，由于前三个格子已经确定，要想符合条件，第四个只能是较少的黑色。
竖和斜也是同理，~~图有点丑，就不放了~~。 ......
.CSS.MAP文件作用
.CSS.MAP文件作用 https://blog.csdn.net/qq_36441169/article/details/102575563 1、简介在写前端代码，使用bootstrap时，发现同一个目录下，不仅仅有.css文件的同时，还存在.css.map文件的存在。在前端页面调试时也发现，映 ......
如何使用NextJS设置Tailwind CSS
Tailwind CSS 是一种流行的实用程序优先 CSS 框架，它提供了一种独特的方法来构建现代且响应迅速的用户界面。 与提供预先设计的组件的传统 CSS 框架不同，Tailwind CSS 专注于提供一组全面的实用程序类，您可以直接将这些类应用于 HTML 元素。 当与用于构建服务器端呈现应用程 ......
css面经
1. 标准盒子模型和普通盒子模型的区别？ 普通盒子模型，box-sizing: border-box, 设置的height/width 属性指的是 content + border + padding 标准盒子模型， box-sizing: content-box, 设置的 height、width ......
CSS（盒子模型其他样式、浮动、常见网页布局、清除浮动、ps切图、学成在线页页面展示）
一、其他样式 1、圆角边框 在 CSS3 中，新增了圆角边框样式，这样我们的盒子就可以变圆角了。 border-radius 属性用于设置元素的外边框圆角。 语法： border-radius:length; 参数值可以为数值或百分比的形式 如果是正方形，想要设置为一个圆，把数值修改为高度或者宽度的 ......
VUE路由传参的实用方式
本文讲解了VUE项目中路由之间的传值方式，涉及到的方法都是开发时常用的，希望对大家有多帮助。 1. 方式一：使用router-link标签 1.1 params 传参 首先定义好路由 const routes = [ { path : ‘/home’ , component : () => impo ......
记录--纯CSS实现一个简单又不失优雅的步骤条
这里给大家分享我在网上总结出来的一些知识，希望对大家有所帮助 步骤条是一种用于引导用户按照特定流程完成任务的导航条，在各种分步表单交互场景中广泛应用。先来看一下几个主流前端 UI 框架中步骤条组件的样子： ElementPlus AntDesign OpenTiny iView 我们可以发现，步骤条 ......
Webpack 插件实现 CSS 样式尺寸单位转换
# Webpack 插件实现 CSS 样式尺寸单位转换 ## 实现方式一 ### 插件代码 以下是编写的一个 Webpack 插件，用于将样式文件中以 rpx 为单位的值转换为以 px 为单位的值（换算比率为 1px=2rpx）： ```javascript const pluginName = " ......
逍遥自在学C语言 | 宏定义技巧让你的C代码快人一步
## 前言 在C语言中，宏定义是一种预处理指令，用于在代码中定义和使用常量、函数或代码片段的替代。 宏定义使用`#define`关键字来定义，并在代码中进行替换。宏定义具有以下优点： 1. **简化代码**：宏定义可以将一些常用的、重复出现的代码片段简化为一个宏名称，提高代码的可读性和简洁性。 2. ......
每日一个挂分小技巧
各位还有什么小技巧可以在下面评论一下(｡･∀･)ﾉﾞ 1. 题意理解错了挂分 多读几遍题 1. freopen注释没删 提交前做好检查！ 3. 写错变量名 4. 除法取模没求逆元~~一般样例能过，要小心~~ 5. 数组、答案没清空 一定一定要记住，**多测数据要清空答案和数组！！！**~~NOIP2 ......
【zsh使用技巧】Linux shell美化，ohmyzsh安装+Xshell美化，体验Mac命令行
解决oh-my-zsh主题乱码问题 解决Rocky Linux下ohmyzsh按Tab键自动补全命令时重复字符且无法删除问题 Solve: Remnant characters when tab completing I see duplicate typed characters after I ......
超实用！常用开源许可证有啥区别。
导读 电脑中的软件都有License,开源软件也不例外。不过开源软件的开源许可证那么多种，又都有什么区别呢？让我们上网搜搜看。 定义 下面是摘录百度百科的定义： license是版权许可证。相当于软件版权。软件版权属于知识产权的著作权范畴，具有知识产权的特征，即时间性，专有性和地域性。软件版权在法律 ......
高数小技巧：和 e^x 有关的积分该怎么算？
高数解题也需要日积月累，下面是和 $e^{x}$ 相关的一些常用解题思路，记得收藏+关注哦，还有更多考研数学实战笔记等着你呢（￣︶￣）↗ ![](https://img2023.cnblogs.com/blog/2743322/202306/2743322-20230606222855539-205 ......
时隔一年，重用了一下HTML和CSS
HTML 列表 无序列表 ul-li 有序列表 ol-li 表格 border指边框，cellspacing指表格元素之间的空隙，为0，则两两边框合二为一 <tr align="center">指这行居中 table是表格 tr指第一行，th指表头元素（第一行的各个列元素） 后面tr依旧，td指此行 ......
提高代码可读性的8个技巧
> 编程有很大一部分时间是在阅读代码，不仅要阅读自己的代码，而且要阅读别人的代码。因此，可读性良好的代码能够大大提高编程效率。可读性良好的代码往往会让代码架构更好，因为程序员更愿意去修改这部分代码，而且也更容易修改。只有在核心领域为了效率才可以放弃可读性，否则可读性是第一位。 ## 用名字代表代码含 ......
实用工具
查找运行时class来自哪个版本的jar包 String className = Appender.class.getName(); className = className.replace('.', '/'); String resource = "/" + className + ".clas ......
maven install 小技巧
创建一个简单的maven分层项目 z-father │ pom.xml │ ├─z-child1 │ │ pom.xml ├─z-child2-withtool │ │ pom.xml └─z-tool │ pom.xml 简单说明：father 有三个modules ， child2 依赖 too ......