文档建议反馈控制台
首页
学习
活动
专区
圈层
工具
MCP广场
文章/答案/技术大牛
发布

18 个漂亮的 Bootstrap 模板

要查找最新信息，请点击文章中的链接。 如果你正在阅读本文，则意味着你与时俱进。...大量精心设计的交互式图表和小部件。 大量可重复使用的组件。 平衡和简单的材料设计。 提供深色和浅色布局。 通过 CSS 即可简单修改。 最近更新：大约一周前。 这是一个用爱开发的模板? ?...具有深色背景的超赞透明设计。 添加了新的浅色和白色版本。 内置HTML5、纯 JS、Bootstrap 和 Sass。 适用于 SAAS、CRM 和 CMS系统。 大量的手写部件。...非常漂亮的管理主题。 专业的电子商务模版。 6 种不同的色彩设计。 技术栈：VueJS、Bootstrap、Firebase、Axios 和 Algolia。...在纯 JS 和 ReactJS 中可用。 没有 jQuery 依赖性。 两个仪表板：分析和电子商务。 带有商店、愿望清单、结帐的“电子商务”部分。 快速搜索。 数百个页面、组件和卡片。

20.9K11

VS Code 1.69 发布：允许快速解决 Git 合并冲突

注意 checkbox 是如何按预期更新的： 关闭合并编辑器或接受合并时，如果未解决所有冲突，则会显示警告。...进度通知将自动显示在状态栏中。隐藏的通知仍然可以在通知中心查看。 切换浅色 / 深色主题 - 在首选的浅色和深色主题之间快速切换。...一个新命令允许你在喜欢的浅色和深色主题之间进行切换，Preferences: Toggle between Light/Dark Themes。当处于浅色主题时，该命令切换到深色主题，反之亦然。...在高对比度主题中时，该命令保持高对比度并切换到相反颜色主题的首选高对比度主题。...JavaScript sourcemap 切换 - 切换到调试编译而不是源代码。 现在可以通过单击调用堆栈视图标题中的 罗盘图标轻松地打开和关闭 sourcemaps。

5.1K10
    • 您找到你想要的搜索结果了吗？
    是的
    没有找到

    深色模式适配指南

    native 深色适配 iOS 在 iOS 系统中，开发者从颜色和图片两个方面来进行适配，我们不需要关心切换模式后该怎么操作，因为这些都由系统帮我们实现。...当切换深色模式时，系统会根据适配的颜色和图片资源进行查找和自动切换对应模式下的颜色和资源文件。...主题背景和样式 主题背景和样式应避免使用旨在于浅色主题背景下使用的硬编码颜色或图标，您应改用主题背景属性（首选）或适合在夜间使用的资源，以下是需要了解的两个最重要的主题背景属性： ?...attr/colorControlNormal 一种通用图标颜色，该颜色包含一个停用状态。 Flutter 这里以 Flutter 为例，简单介绍下跨平台开发框架如何适配深色模式。...我们可以在 Widget 的 build 方法中通过 Theme.of(context) 函数使用自定义的主题。

    3.6K31

    Qt桌面软件的多主题风格界面

    虽然一个软件可以拥有无数个界面风格，但是从实用性角度，只需要两个风格：亮色和暗色。实现方案在 Qt 中实现多个主题风格，同时这些风格之间还可以动态切换，已经有一些成熟的方案。...本文只讨论最常用的两种实现方式：源码和qss文件。这两种主流方法细节如下：1. 在C++或Python源代码中设置QStyle这是最经典的做法。开发者直接在源码中定义不同主题，每个主题定义好颜色。...亮色vs暗色亮色和暗色是开发多风格主题最主要的两个色系。浅色风格和操作系统的原生风格比较相似。因此，在开发多风格界面时，主要工作就是是增加暗色主题。...如在浅色主题背景下设计的图标，在深色背景下就显得非常不明显。因此就需要对图标管理有一个很好的方式。Qt为多风格主题提供了图标的解决方案。常用的方式有三种。1....且可以实现复杂且好看的图标集。也是WELSIM的亮暗两种风格的图标集方案。在使用两套图标集时，判断应用当前的主题是否为深色，如果是深色就应用深色图标，反之则使用浅色图标。

    16201

    H5 项目如何适配暗黑模式

    一、背景 随着 iOS 13 的发布，深色模式（Dark Mode）越来越多地出现在大众的视野中，支持深色模式已经成为现代移动应用和网站的一个潮流，前段时间更是因为微信的适配再度引起热议。...如何切换深色模式 iOS：“设置”--“显示与亮度”--“外观”，选择“深色” Android：“系统设置”--“显示”--“深色模式”。...1.1meta 在head中声明，声明当前页面支持 light 和 dark 两种模式，系统切换到深色模式时...在布尔值上下文中，其执行结果为 false。 light 表示用户已告知系统他们选择使用浅色主题的界面。 dark 表示用户已告知系统他们选择使用暗色主题的界面。...HTML 元素通过包含零或多个 元素和一个 元素来为不同的显示/设备场景提供图像版本。

    3.3K50

    【跟着AI学】MindFlow项目开发实战（八）

    CSS变量主题系统，支持浅色、深色和自动三种模式。...dependencies":{"@reduxjs/toolkit":"^2.0.0","@tauri-apps/api":"^1.5.0","react-redux":"^9.0.0"}}6.使用指南6.1主题切换快速切换点击侧边栏的主题图标在浅色.../深色/自动之间循环切换详细设置点击设置按钮（⚙️）在"外观"部分选择主题点击保存6.2配置编辑器打开设置对话框切换到"编辑器"标签调整各项配置：字体大小：10-24px字体：FiraCode、Consolas..."配置管理"标签点击"重置为默认"确认重置操作配置恢复默认值7.总结Phase6的完成标志着MindFlow拥有完整的主题与配置系统：✅主题系统-浅色/深色/自动三种模式✅配置管理-可视化设置界面✅双层持久化...-localStorage+文件系统✅FiraCode字体-专业编程字体✅导入/导出-灵活的配置管理✅实时预览-配置即时生效现在，用户可以在MindFlow中：自由切换主题模式可视化配置所有设置享受双层持久化保障导入导出配置文件使用专业的

    19810

    原来在Android中请求权限也可以有这么棒的用户体验

    另外，为了让界面元素更加丰富，我们在每个权限组名的前面还加上了该组所对应的图标，图标的获取可以通过如下代码实现： context.packageManager.getPermissionGroupInfo...我们都知道，从Android 10系统开始，Google引用了深色主题功能，一个出色的App在用户开启了深色主题模式之后，应该自动将界面也切换成深色模式。...而PermissionX同样对此功能进行了适配，在手机启用了深色主题模式之后，权限提醒对话框的效果如下图所示： ? 对话框上的颜色都是我精心调整过的，不管是深色主题还是浅色主题，看起来都会非常舒适。...这里setDialogTintColor()方法接收两个参数，其中第一个参数是设置浅色主题下的颜色值，第二个参数是设置深色主题下的颜色值。...既然是要自定义颜色值，那么肯定要把浅色主题和深色主题两种场景都考虑到才行。 现在重新运行程序之后，浅色主题和深色主题下的对话框效果分别如下图所示： ? ?

    3.3K30

    Android 10适配要点，深色主题

    在第12章中我们曾经学习过，AppCompat库内置的主题恰好主要分为浅色主题和深色主题两类，比如MaterialTest项目中目前使用的Theme.AppCompat.Light.NoActionBar...因此，在普通情况下MaterialTest项目仍然会使用浅色主题，和之前并没有什么区别，但是一旦用户在系统设置中开启了深色主题，MaterialTest项目就会自动使用相应的深色主题。...然而，虽然现在界面中的主要内容都已经自动切换成了深色主题，但是你会发现标题栏和悬浮按钮仍然保持着和浅色主题时一样的颜色。...虽说使用主题差异型的编程方式几乎可以帮你解决所有的适配问题，但是在DayNight主题下，我们最好还是尽量减少通过硬编码的方式来指定控件的颜色，而是应该更多地使用能够根据当前主题自动切换颜色的主题属性。...在MaterialTest当中，我们只需要使用如下代码就可以实现浅色主题和深色主题动态切换的功能： class MainActivity : AppCompatActivity() { override

    2.3K10

    开箱IDEA全新 UI，期待下一次见面

    新 UI 主要变化： 带有新 VCS、项目和运行小部件的简化主工具栏 新的工具窗口布局 新的浅色和深色主题 更新的图标集 当时看到新UI的时候，也是焕然一新，可能是视觉疲劳吧，看之前的看久了，于是抱着试一试的心态去申请...下面就体验的不同简单说一下哈哈哈，目前官方还是测试阶段，存在bug 主题 主题主要分为深色和浅色两个 Dark Light，切换之后，菜单栏字体看不清了 导航栏 字体 Inter 字体用于所有受支持的操作系统上的...它是一种强大且开发良好的UI字体，已经在几个JetBrains产品中使用，如Toolbox和Space。以前，在每个平台上都使用默认的操作系统字体。...这些字体完全不同，因此需要额外的设计和开发，以确保在每个平台上正确呈现 UI。...新UI对字体更加亮了 鼠标菜单 间距更加宽了 通知消息栏 消息通知栏圆角化 总结一下 新版UI的确有焕然一新的感觉，对于像我这种爱折腾的人来说，时不时切换一下，新鲜感 但目前问题还是比较多的，切换主题存在

    53310

    谷歌MD深色主题设计规范详解（附Sketch官方文件下载）

    在APP的顶部菜单中显示主题开关 ? 在弹出菜单的菜单层中显示开关 ? 在APP的设置列表当中显示开关 属性 深色主题使用的是深灰色，而不是黑色来作为主要的色彩。...推荐深色主题下的前景深灰色彩为 #121212 高程 在深色主题当中，组件在高程上和之前在浅色主题下应该是一样的，所以它应该也拥有相同级别的阴影。...所有的深色主题的配色方案都应该让UI中的元素都足够有对比度，足以通过 WCAG 的 AA 规则，也就是超过 4.5:1 的底线。...文本和图标色彩 当文本、图标等元素，被置于背景或者某个控件上方的时候，为了进行区分的时候，所应该使用的色彩。 在默认情况下，深色主题下的被置于色块上的文本和图标元素，色彩是以黑白两色为主。 ?...在深色主题当中，呈现状态的叠加层应该使用与默认主题（或者浅色主题）相同的参数，并且可以通过调整来确保它来通过 AA 对比度等级标准。

    11.3K10

    vue项目主题切换

    实际项目中经常用到主题切换，浅色系，深色系切换 主要涉及的变化 1、css样式 2、图表涉及到js中颜色的切换 3、图片的切换 主要的实现原理是，2套css样式，2套js文件，如果需要切换图片的情况也需要...2套图片，页面上有个切换按钮，点击的时候切换css样式和js文件，以及切换图片，css文件切换时会立即起效，但是js没有效果，需要重新刷新下，采用的是点击按钮的时候直接reload,切换样式文件和js文件都在初始化时进行...具体实现 准备文件 （1）项目中使用是vue和element ,首先配置并下载element的样式，一个是浅色 /ElementLightTheme/index.css，一个是深色/ElementDarkTheme...浅色/lightTheme.js，深色/darkTheme.js 放在public文件夹下 lightTheme.css和/darkTheme.css，变量名称一样，颜色值不一样 :root{...  ,属性名一样 var baseColor = { fontMainColor: "#333", } 在public里面的index.html引入一个默认的浅色element css 和一个自己写的样式文件

    1.5K20

    不懂设计的产品不是好开发

    通过这篇文章，我将向大家介绍下关于设计的一些基本知识，让广大开发者在平时的开发中，可以更好的和设计、产品合作（撕逼）。...由于屏幕上的大部分颜色都是background和surface的颜色，在深色主题中，与浅色主题相比，background和surface的颜色会有一个较低的值（亮度）。...此外，与浅色主题相比，深色主题中的primary和secondary color应该具有较低的色度（饱和度较低）。 2.3 Color Contrast 色彩对比是关于三维色彩系统中的位置差异。...2.4 Material Palette Generator 考虑到三维模型，当我们从浅色主题切换到深色主题时： background和surface的颜色应该从上往下移动 primary和secondary...深色和浅色主题的secondary (accent) color色调可以选择与primary color类似的颜色，只是深色主题的次要变体颜色建议在200-50范围内，而不是500。 3.

    3.5K20

    GitHub开源项目，这款、款工具可以调节Windows 音量

    4️⃣ 默认播放设备管理 你可以设置默认的音频输出设备，并在需要时快速切换。再也不用进入控制面板去修改默认设备了。 5️⃣ 主题支持 完美支持 Windows 的浅色和深色模式，并适配所有系统强调色。...第二步：启动和基础使用 安装完成后，EarTrumpet 会自动在系统托盘中显示一个喇叭图标。...为单个应用切换输出设备： 在音量控制面板中找到目标应用 右键点击该应用（或点击应用名称旁的箭头） 在弹出菜单中选择"移动到" 选择你想要的输出设备（耳机、音箱、蓝牙设备等） 切换默认输出设备： 右键点击系统托盘中的...EarTrumpet 图标 在设备列表中选择想要设为默认的设备 点击后，所有新启动的应用都会使用该设备输出音频 第四步：个性化设置 打开设置界面： 右键点击系统托盘中的 EarTrumpet 图标 选择..."设置" 在设置中你可以配置： 启动选项：设置开机自启动 界面语言：选择简体中文或其他语言 主题模式：跟随系统或手动选择浅色/深色模式 音量步长：调节每次点击音量键的增减幅度 通知设置：选择是否显示音量变化提示

    27710

    如何在网页设计中实现深色模式：增强用户体验

    支持多种环境：喜欢在夜间或弱光条件下浏览网页的用户可以借助深色模式来实现。通过提供典型的浅色界面的深色主题替代方案，网站可以在不同的照明环境下满足用户的偏好和需求。...幸运的是，使用 CSS 实现深色模式相对简单，并且可以通过一些简单的技术来实现。在本指南中，我们将探索如何使用 CSS 创建深色模式切换按钮并在浅色和深色模式之间切换。...CSS 变量（自定义属性） CSS 变量，也称为自定义属性，在实现深色模式中发挥着关键作用。通过定义颜色和其他样式属性的变量，我们可以轻松地在不同主题之间切换，而无需修改单独的 CSS 规则。...深色模式切换按钮 接下来，让我们创建一个切换按钮，允许用户在浅色模式和深色模式之间切换。...以下是一些需要记住的重要事项： 清晰的视觉提示：为了让用户轻松地在浅色和深色主题之间转换，请在深色模式可用并激活时清晰地显示视觉提示。

    1.8K10

    BurpSuite_pro_2020.12最新汉化破解版（免费下载）

    官方说明如下： 此版本提供以下改进和错误修复： UI主题之间的动态切换 在显示设置中的新的浅色和深色主题之间切换时，您不再需要在应用此更改之前重新启动Burp。...如果在扫描配置中禁用了“将嵌入式浏览器用于抓取和审核”选项，则将无法使用包含片段的种子URL开始扫描。 嵌入式浏览器升级 Burp的嵌入式浏览器已升级到Chromium 87.0.4280.88。...用户界面改进 问题严重性级别的图标和图标颜色已更改。我们还调整了浅色和深色主题的“套件”选项卡栏的背景颜色。...通过我们的错误赏金计划已报告了此问题。 Bug修复 此版本还提供了以下错误修复： 将拦截的请求复制为curl命令不再引入重复的Cookie标头。...在扫描期间，搜寻器在发送请求时不再使用Burp的cookie罐中的cookie。 用户可以再次将内容粘贴到“扩展”选项卡的消息编辑器中。 运行 window系统双击start.bat启动 ?

    4.6K40

    PortManager (端口管理器)

    Blazor Web 版本 基于 .NET 10 和 Blazor Server 构建的现代化 Web 界面，支持深色/浅色主题切换。...持久化: 隧道信息保存到本地，重启后自动恢复 用户界面 主题支持: 深色和浅色主题切换 响应式设计: 适配桌面和移动设备 现代化UI: 基于 MASA Blazor 的 Material Design...使用切换按钮在卡片视图和表格视图之间切换 终止进程 找到要终止的端口 点击端口卡片上的"✕"终止按钮 进程将被立即终止 收藏端口 将鼠标悬停在端口卡片上 点击星形图标添加/移除收藏 收藏的端口显示在列表顶部...监控端口 点击端口卡片上的""监控按钮 当监控的端口启动或停止时，会收到通知 在"通知历史"中查看所有状态变化 批量操作 点击端口卡片选择多个端口 使用顶部批量操作按钮： 终止所有选中的进程 将所有添加到收藏...PATH 中可访问 确保端口未被占用 检查应用程序日志中的错误消息 获取帮助 如果您遇到任何问题或有疑问： 查看文档: 阅读此README和内联帮助 搜索现有问题: 在 GitHub Issues 中查找类似问题

    11110

    CSS控制界面风格及深浅色模式的一些思路

    我们设定一个设置功能，这套功能是本人研究开发学习使用，请大家多提意见、建议，登录后如下图：        如图的左上开始菜单按钮、中部的导航快捷链接和右下方的快捷设置图标，三个入口均可以访问设置功能...调用后如下图：       点击设置继续层级菜单，操作方式类似手机界面：        如图我们在样式外观选项里提供了“简约动感” 和 “经典” 两选择，显示与亮度选项里有三个模式，即浅色模式、深色模式与智能模式...（根据时间自动进行深浅切换的一种模式），以下是这几种方式的组合效果，大家可以参照一下： （一）简约动感之浅色模式 简约动感的主要体现为文本框为下划线式，另外还有按钮元素的控制等。...(二) 简约动感之深色模式 （三）经典之浅色模式 （四）经典之深色模式 实现的思路大体是设计N套皮肤风格CSS，这是里假设为 JANE.CSS(简约）和 CLASSIC.CSS(经典)，再配套对应 JANE_STD.CSS...(浅色) JANE_DARK.CSS (深色) ，CLASSIC_STD.CSS (浅色) CLASSIC_DARK.CSS (深色) 来控制深浅色的切换，规则的定义有助于JS的控制和功能的区分、细节元素的处理

    28210
    点击加载更多

    相关资讯

    热门标签

    更多标签

    活动推荐

      运营活动

      活动名称
      广告关闭

      腾讯云开发者

      扫码关注腾讯云开发者

      扫码关注腾讯云开发者

      领取腾讯云代金券

      热门产品

      热门推荐

      更多推荐

      Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有

      深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 粤公网安备44030502008569号

      腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号

      领券