修改杂志布局下,首页“TAB”三栏显示效果

  • A+
所属分类:建博笔记

先来看一下主题首页的TAB三栏默认显示效果:

默认显示效果

感觉这样的效果并不好看,三个面板挤在一起,而右侧却留了好多空白。

修改方法

打开【style.css】文件,找到代码

.tab-hd-con {
    width: 100px;
}

.tab-hd .current {
    width: 100px;
}

将其修改为

.tab-hd-con {
    width: 33.33333333333333333%;
}

.tab-hd .current {
    width: 33.33333333333333333%;
}

同时,将

.tab-hd-con {
    float: left;
    text-align: center;
    cursor: pointer;
    height: 39px;
    border-right: 1px solid #ddd;
}

中的

border-right: 1px solid #ddd;

修改为

border-right: 0;

即可。

修改后的效果:

修改后的效果

若文章图片、下载链接、网盘密码等信息出错,请留言反馈,博主将第一时间更新!如果喜欢,请打赏支持本站,谢谢大家!
isdola

发表评论

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen: