仿94设计素材网vip界面表格 - B2主题wordpress美化

仿94设计素材网vip界面采用了表格的方法对不同的权限进行了切分,看起来更加的清晰和一目了然。

相比于默认的会员界面,仿94设计素材网vip界面采用了表格的方法对不同的权限进行了切分,看起来更加的清晰和一目了然。

效果预览:

仿94设计素材网vip界面表格 - B2主题wordpress美化-Npcink

如何实现?

将以下代码添加至主题根目录下的style.css文件底部保存即可。

/*会员*/
.vip-list-in {
    padding: 0px;
}

.vip-item {
    padding: 0;
    width: 30%;/*20%、25%、50%宽度分割*/
    border: 1px solid #ffffff;
}
/*h2标题*/
.vip-list-in h2 {
    padding: 20px 0;
    background: #ece7dd;
}

.vip-list-in .vip-price {
    margin: 0;
    padding: 20px 0;
    background: #fff7e9;
}

.vip-row li {
    margin: 1px 0;
    margin-bottom: 1px;
    margin-bottom: 0;
    padding: 15px 0;
    border-bottom: 1px solid #fff;
    background: #f9f9f9;
}

.vip-buy {
    margin: 0;
    padding: 20px;
    background: #fbf9f7;
}

.vip-allow.allow i {
    color: #e0ac7f;/*图标颜色*/
}

相关链接:

仿94设计素材网vip界面表格 - B2主题wordpress美化-Npcink
仿94设计素材网vip界面表格 - B2主题wordpress美化-Npcink

仿94设计素材网模块标题 - B2主题wordpress美化

94设计素材网的模块标题简洁大气,表意明确,鲜明的颜色区分让一个个的按钮生动灵活
仿94设计素材网vip界面表格 - B2主题wordpress美化-Npcink
仿94设计素材网vip界面表格 - B2主题wordpress美化-Npcink

简单清爽的快速引导卡片 - wordpress区块

这次的wordpress区块分享一款简单清新的引导卡片,虽然没有响应式布局,但其恰到好处的动效定会让你和你的访客们眼前一亮,简单直白的文字却能更加精准的传达信
2020-07-09
WP教程

仿94设计素材网模块标题 - B2主题wordpress美化

2020-7-9 14:54:18

WP教程

怎么查看哔哩哔哩的AV号? - wordpress教程

2020-7-10 6:10:00

⚠️
Npcink上的部份代码及教程来源于互联网,仅供网友学习交流,若您喜欢本文可附上原文链接随意转载。
无意侵害您的权益,请发送邮件至 link@baimu.org 或点击右侧 私信:Muze 反馈,我们将尽快处理。
0 条回复 A文章作者 M管理员
    暂无讨论,说说你的看法吧
个人中心
购物车
优惠劵
今日签到
搜索