Bootstrap中定制LESS-颜色及导航条(推荐)


Posted in Javascript onNovember 21, 2016

 主题色

在variables.less文件的开始,可以看到灰色及品牌色的默认变量及其值

@gray-darker: lighten(#000,13.5%); //#222
@gray-dark

我们可以直接进行替换,以涵盖我们所需的完整灰度空间

@gray-darker: #222;
@gray-dark: #454545;
@gray: #777;
@gray-light: #aeaeae;
@gray-lighter: #ccc
@gray-lightest: #ededed
@offwhite: #fafafa;

将品牌颜色改为金黄色:

@brand-primary: #c1ba62;

导航条颜色变量

在variables.less中修改下列值:

@navbar-height: 64px;
@navbar-margin-bottom: 0; // was @line-height-computed
...
@navbar-default-color: @gray;
@navbar-default-bg: #fff;
@navbar-default-border: @gray-light; // darken(@navbar-default-bg, 9.5%);
...
// Navbar links
@navbar-default-link-color: @navbar-default-color;
@navbar-default-link-hover-color: @link-hover-color;
@navbar-default-link-hover-bg: @off-white;
@navbar-default-link-active-color: @link-hover-color;
@navbar-default-link-active-bg: @gray-lightest;
@navbar-default-link-disabled-color: @gray-lighter;
@navbar-default-link-disabled-bg: transparent;

会出现有关导航条的新特征。

以上所述是小编给大家介绍的Bootstrap中定制LESS-颜色及导航条,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
小型js框架veryide.librar源代码
Mar 05 Javascript
IE6下通过a标签点击切换图片的问题
Nov 14 Javascript
js 程序执行与顺序实现详解
May 13 Javascript
javascript中setInterval的用法
Jul 19 Javascript
基于JavaScript如何制作遮罩层对话框
Jan 26 Javascript
使用 stylelint检查CSS_StyleLint
Apr 28 Javascript
jQuery处理XML文件的几种方法
Jun 14 Javascript
浅谈JavaScript 覆盖原型以及更改原型
Aug 31 Javascript
解决URL地址中的中文乱码问题的办法
Feb 10 Javascript
使用Vue写一个datepicker的示例
Jan 27 Javascript
javascript trie前缀树的示例
Jan 29 Javascript
Vue实现数据表格合并列rowspan效果
Nov 30 Javascript
js实现HashTable(哈希表)的实例分析
Nov 21 #Javascript
详解js中call与apply关键字的作用
Nov 21 #Javascript
微信小程序购物商城系统开发系列-目录结构介绍
Nov 21 #Javascript
微信小程序购物商城系统开发系列-工具篇的介绍
Nov 21 #Javascript
全面解析node 表单的图片上传
Nov 21 #Javascript
利用fecha进行JS日期处理
Nov 21 #Javascript
Bootstrap Modal遮罩弹出层(完整版)
Nov 21 #Javascript
You might like
PHP与已存在的Java应用程序集成
2006/10/09 PHP
谈谈PHP语法(3)
2006/10/09 PHP
SSI指令
2006/11/25 PHP
CodeIgniter使用phpcms模板引擎
2013/11/12 PHP
php微信开发之批量生成带参数的二维码
2016/06/26 PHP
addRule在firefox下的兼容写法
2006/11/30 Javascript
jquery创建一个新的节点对象(自定义结构/内容)的好方法
2013/01/21 Javascript
鼠标悬浮显示二级菜单效果的jquery实现
2014/10/29 Javascript
jQuery实现带动画效果的多级下拉菜单代码
2015/09/08 Javascript
javascript设置页面背景色及背景图片的方法
2015/12/29 Javascript
React实现双向绑定示例代码
2016/09/19 Javascript
DOM 事件的深入浅出(二)
2016/12/05 Javascript
js鼠标经过tab选项卡时实现切换延迟
2017/03/24 Javascript
解决ie img标签内存泄漏的问题
2017/10/13 Javascript
VUE2.0+ElementUI2.0表格el-table循环动态列渲染的写法详解
2018/11/30 Javascript
如何通过JS实现转码与解码
2020/02/21 Javascript
vue项目实现多语言切换的思路
2020/09/17 Javascript
Vue自定义表单内容检查rules实例
2020/10/30 Javascript
[01:31]DOTA2上海特级锦标赛 SECRET战队完整宣传片
2016/03/16 DOTA
最基础的Python的socket编程入门教程
2015/04/23 Python
python处理二进制数据的方法
2015/06/03 Python
Python创建xml文件示例
2017/03/22 Python
Python自定义函数定义,参数,调用代码解析
2017/12/27 Python
python skimage 连通性区域检测方法
2018/06/21 Python
Django框架多表查询实例分析
2018/07/04 Python
Python插件机制实现详解
2020/05/04 Python
python如何保存文本文件
2020/06/07 Python
Linux安装Python3如何和系统自带的Python2并存
2020/07/23 Python
Python JSON常用编解码方法代码实例
2020/09/05 Python
世界上最大的曲棍球商店:Pro Hockey Life
2017/10/30 全球购物
阿根廷在线宠物商店:Puppis
2018/03/23 全球购物
Homestay中文官网:全球寄宿家庭
2018/10/18 全球购物
英国名牌服装购物网站:OD’s Designer
2019/09/02 全球购物
英国领先的独立酒精饮料零售商:DrinkSupermarket
2021/01/13 全球购物
毕业生代领毕业材料的授权委托书
2014/09/29 职场文书
如何自己动手写SQL执行引擎
2021/06/02 MySQL