子比主题仿Mac窗口控制点
为您的网站添加精美的Mac风格窗口控制按钮,提升用户体验和界面美观度
功能说明
这些仿Mac窗口控制点不仅具有美观的视觉效果,还包含实用的功能提示和交互效果。当用户悬停在控制点上时,会显示功能提示,点击时会有动画反馈。
您可以将这些控制点集成到子比主题的弹窗、模块或任何需要窗口控制的元素中,为用户提供一致且直观的操作体验。
实现代码
<div class=”mac-dots”>
<div class=”dot close-dot” data-tooltip=”关闭”></div>
<div class=”dot minimize-dot” data-tooltip=”最小化”></div>
<div class=”dot maximize-dot” data-tooltip=”最大化”></div>
</div>
.mac-dots {
display: flex;
gap: 10px;
}
.dot {
width: 16px;
height: 16px;
border-radius: 50%;
cursor: pointer;
transition: all 0.3s ease;
}
.close-dot {
background: #ff5f56;
}
.minimize-dot {
background: #ffbd2e;
}
.maximize-dot {
background: #27c93f;
}
应用示例
可用于登录弹窗的顶部装饰
可用于设置面板的窗口控制
暂无评论内容