• 欢迎访问搞代码网站,推荐使用最新版火狐浏览器和Chrome浏览器访问本网站!
  • 如果您觉得本站非常有看点,那么赶紧使用Ctrl+D 收藏搞代码吧

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

php 搞代码 4年前 (2022-01-04) 36次浏览 已收录 0个评论

主题色

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

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

来源gaodai$ma#com搞$代*码网

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

@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;

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


搞代码网(gaodaima.com)提供的所有资源部分来自互联网,如果有侵犯您的版权或其他权益,请说明详细缘由并提供版权或权益证明然后发送到邮箱[email protected],我们会在看到邮件的第一时间内为您处理,或直接联系QQ:872152909。本网站采用BY-NC-SA协议进行授权
转载请注明原文链接:Bootstrap中定制LESS-颜色及导航条(推荐)

喜欢 (0)
[搞代码]
分享 (0)
发表我的评论
取消评论

表情 贴图 加粗 删除线 居中 斜体 签到

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址