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 相关文章推荐
javascript截取字符串(通过substring实现并支持中英文混合)
Jun 24 Javascript
通过url查找a元素并点击
Apr 09 Javascript
html的DOM中document对象anchors集合用法实例
Jan 21 Javascript
JS修改iframe页面背景颜色的方法
Apr 01 Javascript
AngularJS+Node.js实现在线聊天室
Aug 28 Javascript
简介EasyUI datagrid editor combogrid搜索框的实现
Apr 01 Javascript
jQuery leonaScroll 1.1 自定义滚动条插件(推荐)
Sep 17 Javascript
jquery 追加元素append、prepend、before、after用法与区别分析
Dec 02 Javascript
详解ES6中的let命令
Apr 05 Javascript
详解vue-router 2.0 常用基础知识点之导航钩子
May 10 Javascript
JS获取短信验证码倒计时的实现代码
May 22 Javascript
Angular4.0中引入laydate.js日期插件的方法教程
Dec 25 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 ss7.5的数据调用 (笔记)
2010/03/08 PHP
PHP设计模式 注册表模式
2012/02/05 PHP
PHP Echo字符串的连接格式
2016/03/07 PHP
Yii框架中用response保存cookie,用request读取cookie的原理解析
2019/09/04 PHP
读jQuery之一(对象的组成)
2011/06/11 Javascript
Js中获取frames中的元素示例代码
2013/07/30 Javascript
js实现滑动触屏事件监听的方法
2015/05/05 Javascript
js实现登陆遮罩效果的方法
2015/07/28 Javascript
jqueryMobile 动态添加元素,展示刷新视图的实现方法
2016/05/28 Javascript
微信小程序 WXML、WXSS 和JS介绍及详解
2016/10/08 Javascript
学习JavaScript图片预加载模块
2016/11/07 Javascript
JS中使用new Date(str)创建时间对象不兼容firefox和ie的解决方法(两种)
2016/12/14 Javascript
详解Vue.js动态绑定class
2016/12/20 Javascript
JavaScript初学者必看“new”
2017/06/12 Javascript
深入理解es6块级作用域的使用
2019/03/28 Javascript
小白教程|一小时上手最流行的前端框架vue(推荐)
2019/04/10 Javascript
Python删除空文件和空文件夹的方法
2015/07/14 Python
Python装饰器基础概念与用法详解
2018/12/22 Python
python算法与数据结构之冒泡排序实例详解
2019/06/22 Python
Python+OpenCV+pyQt5录制双目摄像头视频的实例
2019/06/28 Python
Python 基于wxpy库实现微信添加好友功能(简洁)
2019/11/29 Python
PyCharm2019.3永久激活破解详细图文教程,亲测可用(不定期更新)
2020/10/29 Python
浅析Python模块之间的相互引用问题
2021/02/26 Python
css3 pointer-events 介绍详解
2017/09/18 HTML / CSS
HTML5拖放效果的实现代码
2016/11/17 HTML / CSS
挪威太阳镜和眼镜网上商城:SmartBuyGlasses挪威
2016/08/20 全球购物
Elemental Herbology官网:英国美容品牌
2019/04/27 全球购物
大学同学聚会邀请函
2014/01/29 职场文书
爱护草坪标语
2014/06/24 职场文书
工会趣味活动方案
2014/08/18 职场文书
机关作风建设工作总结
2014/10/23 职场文书
群众路线教育实践活动总结
2014/10/30 职场文书
2015年七一建党节慰问信
2015/03/23 职场文书
革命电影观后感
2015/06/18 职场文书
爱国教育主题班会
2015/08/14 职场文书
2016年党员学习廉政准则心得体会
2016/01/20 职场文书