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判断页面刷新或关闭的方法(onbeforeunload与onunload事件)
Jun 22 Javascript
Javascript中浮点数相乘的一个解决方法
Jun 03 Javascript
用jquery修复在iframe下的页面锚点失效问题
Aug 22 Javascript
JQuery遍历json数组的3种方法
Nov 08 Javascript
JavaScript 对象深入学习总结(经典)
Sep 29 Javascript
谈一谈JS消息机制和事件机制的理解
Apr 14 Javascript
Javascript函数中的arguments.callee用法实例分析
Sep 16 Javascript
Angular.js之作用域scope'@','=','&'实例详解
Feb 28 Javascript
vue 过滤器filter实例详解
Mar 14 Javascript
AngularJS上传文件的示例代码
Nov 10 Javascript
React中使用Vditor自定义图片详解
Dec 25 Javascript
一篇文章学会Vue中间件管道
Jun 20 Vue.js
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
理解PHP5中static和const关键字的区别
2007/03/19 PHP
PHP 获取MSN好友列表的代码(2009-05-14测试通过)
2009/09/09 PHP
PHP 遍历文件实现代码
2011/05/04 PHP
php+MySQL判断update语句是否执行成功的方法
2014/08/28 PHP
Yii框架调试心得--在页面输出执行sql语句
2014/12/25 PHP
基于GD2图形库的PHP生成图片缩略图类代码分享
2015/02/08 PHP
对于Laravel 5.5核心架构的深入理解
2018/02/22 PHP
jquery中的sortable排序之后的保存状态的解决方法
2010/01/28 Javascript
可以用来调试JavaScript错误的解决方案
2010/08/07 Javascript
jQuery 翻牌或百叶窗效果(内容三秒自动切换)
2012/06/14 Javascript
jQuery$命名冲突怎么办如何解决
2014/01/16 Javascript
JavaScript简介
2015/02/15 Javascript
jquery不常用方法汇总
2015/07/26 Javascript
Jquery实现瀑布流布局(备有详细注释)
2015/07/31 Javascript
JS实现的多张图片轮流播放幻灯片效果
2016/07/22 Javascript
AngularJS入门教程之AngularJS 模板
2016/08/18 Javascript
AngularJs  Understanding Angular Templates
2016/09/02 Javascript
vue.js开发环境安装教程
2017/03/17 Javascript
node.js学习之事件模块Events的使用示例
2017/09/28 Javascript
基于javascript 显式转换与隐式转换(详解)
2017/12/15 Javascript
原生JS实现的简单小钟表功能示例
2018/08/30 Javascript
vue实现网络图片瀑布流 + 下拉刷新 + 上拉加载更多(步骤详解)
2020/01/14 Javascript
浅谈Vue组件单元测试究竟测试什么
2020/02/05 Javascript
fastcgi文件读取漏洞之python扫描脚本
2017/04/23 Python
Python元字符的用法实例解析
2018/01/17 Python
Python 使用 Pillow 模块给图片添加文字水印的方法
2019/08/30 Python
CSS3的RGBA中关于整数和百分比值的转换
2015/08/04 HTML / CSS
Vans英国官方网站:美国南加州的原创极限运动潮牌
2017/01/20 全球购物
GLAMGLOW香港官网:明星出镜前的秘密武器
2017/03/16 全球购物
附答案的Java面试题
2012/11/19 面试题
北京RT科技有限公司.net工程师面试题
2013/02/15 面试题
请说出以下代码输出什么
2013/08/30 面试题
英语专业求职信
2014/07/08 职场文书
培训通知
2015/04/17 职场文书
dubbo服务整合zipkin详解
2021/07/26 Java/Android
一篇文章了解正则表达式的替换技巧
2022/02/24 Javascript