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 相关文章推荐
子窗口、父窗口和Silverlight之间的相互调用
Aug 16 Javascript
jQuery实战之品牌展示列表效果
Apr 10 Javascript
jquery插件制作 手风琴Panel效果实现
Aug 17 Javascript
基于JavaScript 声明全局变量的三种方式详解
May 07 Javascript
浅析Node在构建超媒体API中的作用
Jul 30 Javascript
详解Angularjs中的依赖注入
Mar 11 Javascript
浅谈js的url解析函数封装
Jun 28 Javascript
基于JavaScript实现购物网站商品放大镜效果
Sep 06 Javascript
JavaScript数组操作详解
Feb 04 Javascript
值得分享和收藏的xmlplus组件学习教程
May 05 Javascript
浅析JavaScript 函数防抖和节流
Jul 13 Javascript
js实现盒子移动动画效果
Aug 09 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抓即时股票信息
2006/10/09 PHP
功能强大的PHP图片处理类(水印、透明度、旋转)
2015/10/21 PHP
ArrayList类(增强版)
2007/04/04 Javascript
jquery 获取标签名(tagName)示例代码
2013/07/11 Javascript
javascript获取元素CSS样式代码示例
2013/11/28 Javascript
jQuery中delegate()方法用法实例
2015/01/19 Javascript
浅谈jquery回调函数callback的使用
2015/01/30 Javascript
使用Node.js为其他程序编写扩展的基本方法
2015/06/23 Javascript
全面解析JavaScript的Backbone.js框架中的Router路由
2016/05/05 Javascript
AngularJs基本特性解析(一)
2016/07/21 Javascript
jQuery的deferred对象使用详解
2016/09/25 Javascript
JS实现Ajax的方法分析
2016/12/20 Javascript
微信小程序 radio单选框组件详解及实例代码
2017/01/10 Javascript
Javascript 链式作用域详细介绍
2017/02/23 Javascript
如何将 jQuery 从你的 Bootstrap 项目中移除(取而代之使用Vue.js)
2017/07/17 jQuery
vue.js或js实现中文A-Z排序的方法
2018/03/08 Javascript
vscode 配置vue+vetur+eslint+prettier自动格式化功能
2020/03/23 Javascript
React实现全选功能
2020/08/25 Javascript
python共享引用(多个变量引用)示例代码
2013/12/04 Python
Python里隐藏的“禅”
2014/06/16 Python
Python基础教程之内置函数locals()和globals()用法分析
2018/03/16 Python
在Python运行时动态查看进程内部信息的方法
2019/02/22 Python
python中树与树的表示知识点总结
2019/09/14 Python
python使用配置文件过程详解
2019/12/28 Python
利用python在excel中画图的实现方法
2020/03/17 Python
HTML5中的强制下载属性download使用实例解析
2016/05/12 HTML / CSS
英国领先的运动物理治疗供应公司:Vivomed
2018/07/14 全球购物
信息专业个人的自我评价
2013/12/27 职场文书
仓库主管岗位职责
2014/03/02 职场文书
国庆节演讲稿范文2014
2014/09/19 职场文书
2015学校图书管理员工作总结
2015/05/11 职场文书
骆驼祥子读书笔记
2015/06/26 职场文书
网络新闻该怎么写?这些写作技巧你都知道吗?
2019/08/26 职场文书
5种方法告诉你如何使JavaScript 代码库更干净
2021/09/15 Javascript
MySQL数据库10秒内插入百万条数据的实现
2021/11/01 MySQL
详解Mysql事务并发(脏读、不可重复读、幻读)
2022/04/29 MySQL