requestAnimationFramerequestAnimationFrame 它是什么? window.requestAnimationFrame()告诉浏览器————你希望执行一个动画,并且要求浏览器在下次重绘或者回流前调用指定的回调函数更新动画。 设置这个 API 的目的是为了让各种网页动画效果(DOM 动画、Canvas 动画、SVG 动画、WebGl 动画)能够有一个统一的刷新机制,逸男2022年8月6日JavaScriptjs工具箱性能优化
新增运算符新增运算符 质数运算符 ** ** 用于指数运算 基本使用 注意点 指数运算符是少有的右结合,连用时会从最右边开始计算 和等号结合使用 指数运算符可以和等号结合使用,形成一个新的赋值运算符 **= 可选链运算符 ?. 有什么用? 在编程过程中如果属性的层级过深,往往需要判断上层对象是否存在,从而避免报错,引起页面加载失败。 上面的代码中,如果 fun 方法的逸男2022年8月6日JavaScript
flex 布局flex 布局 网页布局(layout)是 CSS 的一个重点应用。 传统的布局有下面几种。 display: block;; display: inline;; display: list-item;; display: table;; display属性搭配position属性和float属性,是最常见的布局解决方案。 但是,这个方案基于盒状模型,对于那阮一峰2022/12/12CSS
多栏式布局多栏式布局 多栏式布局是 CSS 原生提供的一种内容分栏显示的解决方案。 基本用法 column-count属性指定div的子元素分成四栏。 column-width属性指定每一栏的宽度。 上面代码中,column-width属性指定每一栏的宽度是 100 像素。如果div元素的宽度是 800 像素,那么内容就将分成 8 栏。 注意,column-count阮一峰2022/12/12CSS
Grid 布局Grid 布局 一、概述 网格布局(Grid)是最强大的 CSS 布局方案。 它将网页划分成一个个网格,可以任意组合不同的网格,做出各种各样的布局。以前,只能通过复杂的 CSS 框架达到的效果,现在浏览器内置了。 上图这样的布局,就是 Grid 布局的拿手好戏。 Grid 布局与 Flex 布局有一定的相似性,都可以指定容器内部多个项目的位置。但是,它们也存阮一峰2022/12/12CSS
清除浮动清除浮动 1.额外标签法 方法: 在浮动元素末尾添加一个空的块级标签 给其设置属性 例如: 注意点: 也称为隔墙法,是 W3C 推荐的做法。; 要求这个新的空标签必须是块级元素; 优点: 通俗易懂,书写方便; 缺点: 添加许多无意义的标签,结构化较差; 2.父级添加 overflow 方法:可以给父级添加 overflow 属性,将其属性值设逸男2022/12/12CSS
隐藏元素的方法隐藏元素的方法 属性隐藏 属性 占文档流 可交互 利于 SEO ------------------ :------: :----: :------: display:none; ❌ ❌ ❌ visibility:hidden; ✅ ❌ ❓ opacity:0; ✅ ✅ ❓ height:0; ❌ ❌ ❓ 定位法 ❌ ✅ ✅ | 其他隐藏方法 定位法逸男2022/12/12CSS