腾讯云开发者社区-腾讯云

开发者社区

文档建议反馈控制台

最新优惠活动

文章/答案/技术大牛

发布

Coco的专栏

专栏作者

253

文章

279809

阅读量

45

订阅数

【布局技巧】Flex 布局下居中溢出滚动截断问题

容器 flex 布局技巧兼容性

在页面布局中，我们经常会遇到/使用这么一类常见的布局，也就是列表内容水平居中于容器中，像是这样：

2023-12-08

2240

CSS 也能实现 if 判断？实现动态高度下的不同样式展现

css 容器布局函数兼容性

这个效果在很多场景都会出现，可以算是一个高频场景，那么在今天，我们能否不使用 JavaScript，仅仅凭借 CSS 实现类似于这样的功能呢？

2023-11-15

2520

现代 CSS 解决方案：原生嵌套（Nesting）

css 容器解决方案语法作用域

很早之前，就写过一篇与原生嵌套相关的文章 -- CSS 即将支持嵌套，SASS/LESS 等预处理器已无用武之地？，彼时 CSS 原生嵌套还处于工作草案 Working Draft (WD) 阶段，而今天（2023-09-02），CSS 原生嵌套 Nesting 终于成为了既定的规范！

2023-09-12

2530

涨姿势了，有意思的气泡 Loading 效果

容器 loading 动画函数技巧

没错，这个效果中的核心气泡效果，其实借助 CSS 中的滤镜，能够比较轻松的实现，就是所需的元素可能多点。参考我们之前的：

2023-04-21

5660

巧用 CSS 变量，实现动画函数复用，制作高级感拉满的网格动画

css 编程算法容器

本文将介绍一种基于 CSS 变量技巧，通过合理使用 CSS 变量，实现 CSS 动画 @keyframes 的复用。

2023-03-08

1.5K0

容器查询 cqw 和 CSS 数学函数 max

容器 css 腾讯云开发者社区

在许久之前，曾经写过这样一篇文章 -- 不定宽溢出文本适配滚动。我们实现了这样一种效果：

2023-03-08

1.2K0

现代图片性能优化及体验优化指南 - 缩放精细化展示及避免布局偏移、拉伸

编程算法容器 css

图片资源，在我们的业务中可谓是占据了非常大头的一环，尤其是其对带宽的消耗是十分巨大的。

2023-03-01

1.1K0

vh 存在问题？试试动态视口单位之 dvh、svh、lvh

css 容器云直播

大部分同学都知道，在 CSS 世界中，有 vw、vh、vmax、vmin 这几个与视口 Viewport 相关的单位。

2023-03-01

1.2K0

现代 CSS 指南 -- at-rule 规则扫盲

这里表示的是与屏幕宽度相关的样式设置，上面的代码表示当屏幕宽度大于 900px 时，内部的样式代码块才能生效。

2022-11-14

1.1K0

超强的纯 CSS 鼠标点击拖拽效果

jquery css html 容器 javascript

而在本文，我们就将打破常规，向大家介绍一种超强的仅仅使用纯 CSS 就能够实现的鼠标点击拖拽效果。

2022-10-28

2K0

有意思的水平横向溢出滚动

容器 css 编程算法

最近接到一个很有意思的需求，能否做到当内容横向溢出时，依然能够使用鼠标滚轮对内容进行滚动的方法。

2022-09-28

2.4K0

新时代布局新特性 -- 容器查询

容器 css 编程算法

终于，在漫长的等待下，容器查询（CSS Container Queries）将在 Chrome 105 版本得到正式的支持！

2022-09-28

2560

有意思的方向裁切 overflow: clip

css 容器腾讯云开发者社区

本文将介绍一个新特性，从 Chrome 90 开始，overflow 新增的一个新特性 -- overflow: clip，使用它，轻松的对溢出方向进行控制。

2022-09-26

6960

Amazing！巧用 CSS 视差实现酷炫交互动效

css 编程算法容器图像处理 javascript

本文将介绍利用 CSS 实现滚动视差效果的一个小技巧，并且，利用这个技巧来制作一些有意思的交互特效。

2022-04-28

7220

革命性创新，动画杀手锏 @scroll-timeline

javascript css node.js 编程算法容器

在 CSS 规范 Scroll-linked Animations 中，推出了一个划时代的 CSS 功能。也就是 -- The @scroll-timeline at-rule，直译过来就是滚动时间线。

2022-03-10

8590

LPL Ban/Pick 选人阶段的遮罩效果是如何实现的？

css svg 容器编程算法

最近 S11 LPL 春季赛开赛，在看比赛的过程中，我发现新赛季的 Ban/Pick 选人阶段，出现了一种新的，有意思的遮罩效果，如下图所示：

2022-03-10

4450

新时代布局中一些有意思的特性

css 容器编程算法

在最新的 Chrome Canary 中，一个有意思的 CSS 语法 Container Queries 得到了支持。

2021-04-22

1.2K0

【面试技巧】老生常谈之 n 种使用 CSS 实现三角形的技巧

编程算法容器 css

在一些面经中，经常能看到有关 CSS 的题目都会有一道如何使用 CSS 绘制三角形，而常见的回答通常也只有使用 border 进行绘制一种方法。

2021-04-13

6010

使用 mask 实现视频弹幕人物遮罩过滤

经常看一些 LOL 比赛直播的小伙伴，肯定都知道，在一些弹幕网站（Bilibili、虎牙）中，当人物与弹幕出现在一起的时候，弹幕会“巧妙”的躲到人物的下面，看着非常的智能。

2021-03-02

8380

CSS 奇技淫巧：动态高度过渡动画

这个问题源自于掘金上的一个留言，一个朋友问到，为什么我下面这段代码的高度过渡动画失效了？

2021-01-14

1.1K0

点击加载更多

社区活动

腾讯技术创作狂欢月

“码”上创作 21 天，分 10000 元奖品池！

Python精品学习库

代码在线跑，知识轻松学

博客搬家 | 分享价值百万资源包

自行/邀约他人一键搬运博客，速成社区影响力并领取好礼

技术创作特训营·精选知识专栏

往期视频·千货材料·成员作品最新动态