想问问有没有炫酷的网页设计模拟

想用html和css弄一个炫酷的网页去参赛,但是不知道哪里去找资源参考

不知道你这个问题是否已经解决, 如果还没有解决的话:
  • 你可以参考下这个问题的回答, 看看是否对你有帮助, 链接: https://ask.csdn.net/questions/1102999
  • 我还给你找了一篇非常好的博客,你可以看看是否有帮助,链接:前端必会的 HTML+CSS 常用技巧 之 解决父元素高度消失或最小高度不能自适应问题
  • 除此之外, 这篇博客: 仅使用HTML和CSS的亮暗模式按钮切换中的 根据用户偏好更改标签 部分也许能够解决你的问题, 你可以仔细阅读以下内容或者直接跳转源博客中阅读:

    现在我们已经交换了暗模式和亮模式,我们需要确保复选框的标签能够反映出这一点。

    如果在屏幕为亮白色时标签上说暗模式处于打开状态,将会令人困惑。

    也有一个快速解决方案。 首先,我们在<label>中添加两组文本,每个用户首选项一组:

    <input id="color-mode" type="checkbox" name="color-mode">
    <label for="color-mode">
        <span class="dark-mode-hide">Dark Mode</span>
        <span class="light-mode-hide">Light Mode</span>
    </label>
    

    然后,根据模式隐藏标签之一。

    这组媒体查询可以让我们双方的目标light-modedark -mode以及浏览器不支持prefers-color-scheme

    .light-mode-hide {
        display:none;
    }
    
    @media (prefers-color-scheme: dark) {
        .dark-mode-hide {
            display:none;
        }
    }
    
    @media (prefers-color-scheme: dark) {
        .light-mode-hide {
            display:initial;
        }
    }
    

    就这些了,欢迎来评论区,让我知道你的想法!


如果你已经解决了该问题, 非常希望你能够分享一下解决方案, 写成博客, 将相关链接放在评论区, 以帮助更多的人 ^-^