css和html的相同和不同颜色,HTML和CSS中的标签颜色问题

$(document).ready(function() {

/* Apply current on Page load */

$('.tab1').addClass('current');

$('.tab-content').css("border-top", "5px solid #3399CC");

$('#tab-1').addClass('current');

$('ul.tabs li').click(function() {

var contentid = '#' + $(this).attr('datatab');

$('ul.tabs li').removeClass('current');

$('.tab-content').removeClass('current');

$(this).addClass('current');

$(contentid).addClass('current').css("border-top", "5px solid " + $(this).css("background-color"));

});

});

.home-tab-title {

width: 100%;

height: 65px;

padding: 10px 0 10px 0;

}

img.home-duck {

width: 35px;

float: left;

padding: 12px 10px 0 0;

}

.home-heading {

display: block;

float: left;

font-size: 22px;

margin-top: 20px;

margin-bottom: 20px;

clear: right;

font-family: "Segoe UI", arial, sans-serif;

}

.home-subheading {

margin-top: 10px;

margin-bottom: 10px;

}

.home-subheading {

font-size: 15px;

color: #000;

font-weight: 500;

font-family: "Segoe UI", arial, sans-serif;

display: inline-flex;

}

.tab-content1 {

margin-left: 2.2em;

display: inline-flex;

flex-direction: row;

flex-wrap: wrap;

justify-content: left;

}

.tab-content1-block {

padding: 0 1em 1em .5em;

min-width: 30%;

}

.tab-content1-block ul li {

margin-bottom: 10px;

margin-left: -22px;

}

— css —

/* Hide the user navigation for community and anon on home. Shows it for pro members. */

.columbia-page-home .elm-header-user-nav {

display: none;

}

.columbia-page-home.elm-user-pro-member.columbia-page-home .elm-header-user-nav {

display: block;

}

/* Hide the user navigation for community and anon on home. */

.columbia-page-home .elm-header-home-nav {

display: none;

}

/* Hides the user nav's global search on home. */

.columbia-page-home .elm-global-search {

visibility: hidden;

}

/* Sets the correct positioning of the footer based on user role for home only. */

.columbia-page-home .elm-footer {

bottom: auto;

}

@media all and (min-width: 78.75em) {

.elm-user-pro-member.columbia-page-home .elm-footer {

bottom: 3.4em;

}

}

@media all and (min-width: 37.5em) {

.elm-user-pro-member.columbia-page-home .elm-footer {

bottom: auto;

}

}

li.ui-state-active {

padding-bottom: 0px !important;

}

— css —

/* Code for PageTabs template */

body .ui-tabs .ui-tabs-nav li a {

padding: .5em 1em;

width: 225px;

word-wrap: initial;

height: 25px;

text-align: center;

display: inline-block;

}

— css —

/* Code for new tabs */

. body {

margin-top: 100px;

font-family: 'Trebuchet MS', serif;

line-height: 1.6 float: left;

}

container {

width: auto;

margin: 0 0;

}

ul.tabs {

margin: 0px;

padding: 0px;

list-style: none;

}

ul.tabs li {

background: #EFEFEF;

color: #222;

display: inline-block;

padding: 10px 15px;

cursor: pointer;

border-top: 1px solid #000;

border-left: 1px solid #000;

border-right: 1px solid #000;

border-radius: 5px 5px 0px 0px;

}

.tab1:hover {

background: #3399CC;

color: #fff;

border: none;

}

.tab2:hover {

background: #12B58A;

color: #fff;

border: none;

}

.tab3:hover {

background: #673ab7;

color: #fff;

border: none;

}

.tab4:hover {

background: #336699;

color: #fff;

border: none;

}

.tab5:hover {

background: #3399CC;

color: #fff;

border: none;

}

.tab6:hover {

background: #12B58A;

color: #fff;

border: none;

}

.tab7:hover {

background: #673ab7;

color: #fff;

border: none;

}

.tab8:hover {

background: #336699;

color: #fff;

border: none;

}

.tab9:hover {

background: #3399CC;

color: #fff;

border: none;

}

.tab10:hover {

background: #12B58A;

color: #fff;

border: none;

}

.tab11:hover {

background: #673ab7;

color: #fff;

border: none;

}

.tab-link.tab1.current {

background: #3399CC;

color: #fff;

border: none;

}

.tab-link.tab2.current {

background: #12B58A;

color: #fff;

border: none;

}

.tab-link.tab3.current {

background: #673ab7;

color: #fff;

border: none;

}

.tab-link.tab4.current {

background: #336699;

color: #fff;

border: none;

}

.tab-link.tab5.current {

background: #3399CC;

color: #fff;

border: none;

}

.tab-link.tab6.current {

background: #12B58A;

color: #fff;

border: none;

}

.tab-link.tab7.current {

background: #673ab7;

color: #fff;

border: none;

}

.tab-link.tab8.current {

background: #336699;

color: #fff;

border: none;

}

.tab-link.tab9.current {

background: #3399CC;

color: #fff;

border: none;

}

.tab-link.tab10.current {

background: #12B58A;

color: #fff;

border: none;

}

.tab-link.tab11.current {

background: #673ab7;

color: #fff;

border: none;

}

.tab-content {

display: none;

background: #ededed;

padding: 15px;

}

.tab-content.current {

display: inherit;

border-top: 5px solid #3399CC;

background: #ffffff;

}

.tab-link {

margin: 0px;

}

Business System Functionality

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值