没有一种方法可以解决界面难题。在本系列中,我们将挑战自己和他人,寻找多种方法来解决界面难题并拓展我们的技能的多样性。
在今天的 GUI 挑战中,@AdamArgyleInk 使用 okLCH 构建广色域调色板,在整个过程中检查易于访问的颜色对...
在今天的 GUI 挑战中,@AdamArgyleInk 为经典科幻电影的 3D 文本效果添加了 #CSS 旋转效果,使其具有互动性。Po...
在今天的 GUI 挑战中,@AdamArgyleInk 将单选按钮组转换为文本对齐更改开关组。了解如何测试无障碍功能...
在今天的 GUI 挑战中,@AdamArgyleInk 使用 CSS clip-path 和 transform,制造出网络故障效果。
在今天的 GUI 挑战中,@AdamArgyleInk 使用 CSS 自定义属性、请求动画帧以及 ...
在今天的 GUI 挑战中,@AdamArgyleInk 使用 transform origin、grid 和 :has() 来创建堆叠的动画卡片。
在如今令人难以置信的 GUI 挑战中,@AdamArgyleInk 可实时编码 CSS 裁剪路径过渡,演示一些 rad 效果,并介绍问题。我...
在今天的 GUI 挑战中,@AdamArgyleInk 使用自定义元素(没有网络组件!)构建提示,:has()、转换和逻辑属性...
在今天的 GUI 挑战中,@AdamArgyleInk 利用 CSS 重现了一种经典的幻象。
在今天的 GUI 挑战中,@AdamArgyleInk 分享了轮播组件的功能和方面:自适应主题、适应各种不同的...
在今天的 GUI 挑战中,@AdamArgyleInk 构建了几个悬浮操作按钮 (FAB),并介绍了用户体验和 CSS 方面的注意事项 ...
在今天的 GUI 挑战中,@AdamArgyleInk 为各种 Web 按钮类型使用自定义属性和用于浅色/深色的 :where() 设置样式...
在今天的 GUI 挑战中,@AdamArgyleInk 展示了如何在视觉上增强对话元素,同时保持出色的无障碍和互操作性...
在今天的 GUI 挑战中,@AdamArgyleInk 介绍了如何设置内置进度元素的样式以及如何实现出色的屏幕阅读器用户体验,li...
在今天的 GUI 挑战中,@AdamArgyleInk 分享了如何用 SVG 构建自适应网站图标。SVG 不仅可以提供无限的...
在今天的 GUI 挑战中,@AdamArgyleInk 分享了如何构建主题切换组件。网站通常允许切换...
在今天的 GUI 挑战中,@AdamArgyleInk 分享了如何构建消息框,这是一种非交互的被动组件,供界面证明...
在今天的 GUI 挑战中,@AdamArgyleInk 分享了他对制作可适应操作系统颜色偏好的 3D 视频游戏菜单的方法...
在今天的 GUI 挑战中,我分享了我关于如何让用户进行多选的想法。为演示多选,我准备了一个过滤器...
在今天的 GUI 挑战中,我分享了我对解决拆分按钮的方法的想法。是精简接口的主要组件,它允许...
在今天的 GUI 挑战中,我与大家分享了我对解决转换问题的想法。一个小巧的、用户体验整合的组件,最终成为了
在今天的 GUI 挑战中,我们将以别出心裁的方式构建面包屑导航组件!此面包屑导航而不是线性链接列表...
在今天的 GUI 挑战中,我们将使用 HSL 构建深色、浅色和暗色配色方案。CSS 适用于各种现代浏览器,它具有如下特点:
在今天的 GUI 挑战中,@Adam Argyle 分享了如何针对网页打造最精简、响应的内嵌滚动体验...
在今天的 GUI 挑战中,@AdamArgyleInk 会在剧集发行后的 30 分钟内回复您的评论。连接...
在今天的 GUI 挑战中,我们构建并演示了一个包含滑块和复选框的动态设置页面。我们的设置页面会迅速响应,支持...
在今天的 GUI 挑战中,我们将构建一个标签页组件,其中包含一些您可能没有想到的超酷功能。我们的标签页可...
我们邀请社区按照您的方式构建了一个侧边导航栏组件,大家都做到了!查看提交内容:
在今天的 GUI 挑战中,我们使用 CSS 和 JS 打造一种响应式、易于访问的滑出式导航用户体验。侧边导航栏可以正常运行...
我们对 5 种不同的 CSS 居中技术进行了压力测试,并邀请您提交自己的技术。向 CSS-Tricks 中的 Chris Coyier 致敬 ...
你看到我按自己的方式创作故事,我向大家发起了挑战,按自己的方式创作故事。在 Twitter 上向 @Geoffrich_ 致敬!正确做法...
在今天的挑战中,我们要对 5 种不同的 CSS 居中技术进行压力测试。看看哪些技巧让您的工具大获成功...
欢迎参加 GUI 挑战,我将以自己的方式创建界面,并鼓励您按照自己的方式去完成。集结我们的创造性思维,我们将...