纳米网格卡片
温馨提示:
公众号:溯光笔记 本站仅为个人兴趣爱好而创立 并不会收费,感谢大家的支持.如有冒犯请联系我.
纳米网格卡片
技术
<div style="position: relative; background: rgba(15, 23, 42, 0.7); border-radius: 20px; padding: 25px; border: 1px solid rgba(0, 247, 255, 0.4); box-shadow: 0 10px 30px rgba(0,0,0,0.3);"> <div style="background-image: linear-gradient(rgba(0, 247, 255, 0.1) 1px, transparent 1px), linear-gradient(90deg, rgba(0, 247, 255, 0.1) 1px, transparent 1px); background-size: 25px 25px; position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 0;"></div> <div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; padding-bottom: 15px; border-bottom: 1px solid rgba(99, 102, 241, 0.3); position: relative; z-index: 1;"> <div style="font-size: 1.5rem; font-weight: 700; color: #00f7ff;"><i class="fas fa-border-none"></i> 纳米网格卡片</div> <div style="padding: 6px 16px; border-radius: 50px; background: rgba(0, 247, 255, 0.15); color: #00f7ff; font-size: 0.9rem; font-weight: 600;">技术</div> </div> <div style="background: rgba(0, 15, 25, 0.6); padding: 20px; border-radius: 12px; border: 1px solid rgba(0, 247, 255, 0.3); margin-bottom: 25px; position: relative; z-index: 1;"> <div style="font-family: 'Courier New', monospace; font-size: 15px; line-height: 1.8;"> // 在这里放置您的代码内容 </div> </div> <button style="background: rgba(99, 102, 241, 0.2); color: #e0e7ff; border: 1px solid rgba(99, 102, 241, 0.5); padding: 10px 25px; border-radius: 8px; font-weight: 600;"> <i class="fas fa-copy"></i> 复制代码 </button> </div>
THE END