bootstrap设置默认主题皮肤

已于 2022-04-25 15:20:58 修改
阅读量1.1k 收藏
点赞数 1
文章标签： bootstrap java
于 2022-04-25 15:20:10 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/hdy12138/article/details/124405556
版权

bootstrap构建的页面右上方的主题按钮有三种主题样式如下：
在这里插入图片描述

系统默认的皮肤是第一种绿色的皮肤，但是公司希望使用模板里的第二种蓝色皮肤作为默认皮肤，所以经过查找原生js文件发现定义了三种不同的皮肤样式skin-1，skin-2，skin-3，这里面skin-1是蓝色对应的样式，所以我这里在main.jsp的body标签对应的class属性里添加上skin-1就完成了。

<body class="fixed-sidebar full-height-layout skin-1" style="overflow:hidden">
寒冷的空气
关注
  • 1
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Bootstrap4动态切换主题
haifeng10001的博客
01-18 6050
bootstrap4有个网站叫做bootswatch，其中已经设计了一些很美的主题： 要想使用也是很简单的，只需要下载其中的bootstrap.css或者bootstrap.min.css并覆盖到自己项目的对应文件就行了。如果你想动态切换的话，现在提供的思路是： 用JavaScript写一个函数响应页面上一个按钮的点击，这个函数主要是获取页面导入css的链接&amp;lt; link &amp;gt;标签，修改...
包含16种主题包的Bootstrap
05-25
将这些主题CSS文件添加到您的HTML文档中，通常是在`bootstrap.css`之后，这样它们的样式会覆盖默认的Bootstrap样式，赋予网页新的外观和感觉。例如，如果有一个名为`dark-theme.css`的主题文件，只需在`<head>`部分...
bootstrap更换默认主体，非常好
gztrljh
09-13 151
bootstrap是非常友好的一个框架。默认主体要是觉得不够好看，可以换一下口味 皮肤下载地址 https://bootswatch.com/ 直接替换原来的整个css就可以了
Python GUI之tkinter的皮肤(ttkbootstrap)打造出你的窗口之美
热门推荐
qq_59142194的博客
04-04 6万+
python GUI之ttkbootstrap（第三方库）官方就很nice啊，直接把他俩结合了起来，并给它穿上了一件“皮肤”（叮：tkinter，您的外挂已到账！）。简单来说就是会tkinter了，那么也就基本上也会ttkbootstrap了，如果不会，那直接学ttkbootstrap难度也与tkinter差不多，简直就是太nice了，哈哈哈。
推荐一款优雅的Select2 Bootstrap4主题：ttskch/select2-bootstrap4-theme
最新发布
gitblog_00066的博客
04-19 489
推荐一款优雅的Select2 Bootstrap4主题：ttskch/select2-bootstrap4-theme 项目地址:https://gitcode.com/ttskch/select2-bootstrap4-theme 在前端开发中，我们常常需要处理下拉选择框，而Select2是一款功能强大、可定制化的下拉选框插件。然而，当我们要在Bootstrap4框架下使用Select2时，如何...
更换主题
sy961485596的博客
07-10 548
2.巴里奥 Drupal 8 - Bootstrap 4（引导3兼容） Barrio被完全重写为Drupal 8 Base Theme。 它基于Bootstrap 4（alpha6），使用根枝条模板来覆盖Drupal标记。 这个主题没有风格而不是布局，作为一个开始的基础主题。 对于极好的块样式操作使用块样式模块。使用此模块，任何块都可以转为下拉菜单，模态或单击塌缩
Bootstrap精美稳定全套CMS后台皮肤源码
03-12
一个完全响应式，基于Bootstrap3.3.6最新版本开发的扁平化主题，她采用了主流的左右两栏式布局，使用了Html5+CSS3等现代技术，她提供了诸多的强大的可以重新组合的UI组件，并集成了最新的jQuery版本(v2.1.4)，当然，也集成了很多功能强大，用途广泛的jQuery插件，她可以用于所有的Web应用程序，如网站管理后台，网站会员中心，CMS，CRM，OA等等，当然，您也可以对她进行深度定制，以做出更强系统。 二、菜单功能 1、完全响应式布局（支持电脑、平板、手机等所有主流设备） 2、基于最新版本的Bootstrap 3.3.6 3、提供3套不同风格的皮肤 4、支持多种布局方式 5、使用最流行的的扁平化设计 6、提供了诸多的UI组件 7、集成多款国内优秀插件，诚意奉献 8、提供盒型、全宽、响应式视图模式 9、采用HTML5 & CSS3，拥有良好的代码结构 三、注意事项 1、开发环境为Visual Studio 2012，使用.net
bootstrap的简单实用
github_40094105的博客
10-07 572
bootstrap的具体使用方法bootstrap其实是把网页等分为了12分栅格参数bootstrap把根据屏幕大小把屏幕分为了4个层级 超小屏幕 小屏幕 中等屏幕 大屏幕 栅格参数，我们看下下面这幅图： 每行的数字全部相加，最终都等于刚刚我让大家记住的12 我现在需要在页面上左右分别显示两个面板，面板上面显示相应的表格数据，且左侧列表占总宽度的3分之2，右侧的面板仅占3分之1
自定义bootstrap 的主题色
fengsh998的专栏
03-07 5285
基于Bootstrap 4.3.1版本：https://getbootstrap.com/docs/4.3/getting-started/introduction/ 基于react脚手架来进行说明！ 基础知识，针对bootstrap使用有一定了解的人群，对webpack有一定了解的人群，对react脚手架有了解。 一步步来，不要急，一口吞不了象。 运行终端: 1. cd 到一个目录。...
bootstrap样式
qq_44981598的博客
09-15 1194
Bootstrap背景颜色</p><p class="bg-danger">Bootstrap背景颜色</p>警告黄：<p class="text-warning">Bootstrap文本颜色</p>危险红：<p class="text-danger">Bootstrap文本颜色</p>信息蓝：<p class="text-info">Bootstrap文本颜色隐藏
bootstrapUI皮肤效果
06-01
5. **CSS 文件**：在压缩包中的`css`目录，存放了样式表文件，可能包含Bootstrap的默认样式以及针对皮肤效果的自定义样式。通过修改或扩展这些CSS，可以改变网页的外观和布局。 6. **JavaScript 文件**：`js`目录下...
bootstrap theme SimplyMe
07-24
bootstrap theme 适合初学者的bootstrap皮肤 更多说明请参考http://blog.csdn.net/chr23899 下的bootstrap栏目
bootstrap 主题
11-14
一个非常好用的bootstrap 模板，自适应后台管理模板。有各种组件，轻松搭建bootstrap网站！
bootstrap创意精美ui列表布局代码
06-11
bootstrap创意精美ui列表布局代码，共有3种效果，鼠标悬停特效非常漂亮，具体请查看演示页面。
Bootstrap Wpf 皮肤
12-08
感谢园子作者对 WPF 的贡献，为防止园子资源被毁，在CSDN备个份，也为热爱 .Net 的同学提供方便！http://www.cnblogs.com/tsliwei/p/6138412.html
两套响应式后台模板绿色和蓝色的bootstrap后台
10-10
两套响应式后台模板绿色和蓝色的bootstrap后台，个人觉得还不错，给大家分享下
Bootstrap后台主题框架demo
05-11
5. **全新的设计**：虽然Bootstrap本身就是一个设计感强烈的框架，但“全新的设计”可能意味着该主题框架对Bootstrap的默认样式进行了改进或创新，提供了更现代、更具吸引力的UI元素和交互效果。 6. **栅格系统**：...
主题引导程序：基于bootstrap 5的Magento 2主题
01-29
为了部署这个基于Bootstrap 5的Magento 2主题，我们需要在Magento 2后台进行配置，指定我们的主题为店面的默认主题。然后，通过编译、清理和刷新缓存等步骤，确保所有的更改都被正确应用和加载。 总的来说，这个...
bootstrap theme 的作用
ISaiSai的专栏
11-02 6132
按钮的话 提供渐变效果 提供一些动画,渐变效果，添加theme 这个css 后，页面更美观<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title></title> <link rel="stylesheet" href="css/bootstrap.min.css"> <link r
bootstrap 怎么设置皮肤
07-14
在Bootstrap中设置皮肤可以通过以下几种方式实现： 1. 使用预定义的主题：Bootstrap提供了一些预定义的主题，你可以直接引入对应的CSS文件来改变整体的外观。例如，你可以在HTML文件中引入`bootstrap.min.css`之后...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值