近期看有人反馈追格小程序的资讯分类略缩图该怎么改?如果是要改成下图效果,其实大家只需要对模板中的css调整便可以了。
结合页面原始的上下结构展示,我们基本上可以不修改页面结构,仅通过调整css,对列表进行任何形式的调整。
这里把如何修改为上图的方法告诉大家,详情参考以下代码(注释的是原有代码,新增的有提示)
打开文件/pages/cms/classify/classify.vue
对照代码修改即可
/** 外框 **/
.zhuige-classify-cms-block {
margin-bottom: 20rpx;
/* 新增 */
display: flex;
align-items: center;
flex-wrap: nowrap;
background-color: #FFFFFF;
border-radius: 12rpx;
padding: 20rpx;
}
/** 图片 **/
.zhuige-classify-cms-block image {
/* height: 200rpx;
width: 100%;
border-radius: 12rpx 12rpx 0 0;
display: inherit; */
/* 新增 */
height: 120rpx;
width: 120rpx;
border-radius: 12rpx;
flex: 0 0 120rpx;
}
/** 文字块 **/
.zhuige-classify-cms-text {
/* padding: 20rpx;
background: #FFFFFF;
border-radius: 0 0 12rpx 12rpx; */
/* 新增 */
width: 300rpx;
margin-left: 20rpx;
}
.zhuige-classify-cms-text view:nth-child(1) text:nth-child(2) {
font-size: 24rpx;
font-weight: 300;
height: 40rpx;
line-height: 40rpx;
border-radius: 24rpx;
padding: 0 24rpx;
margin-left: 12rpx;
color: #FF6348;
background: #FFEAE3;
/* 新增 */
white-space: nowrap;
}
-
担心WordPress REST API暴露用户名?这里有一个简单的屏蔽方法!在深入探讨WordPress REST API的利用与功能时,追格小编虽已分享了多篇相关内容,但我们依然理解,部分用户可能仍对网站用户名暴露的问题心存顾虑,尤其是当他们并不需要使用到如古腾堡编辑器或小程序等特定功能时。针对这一关切,今天小编特地为大家介绍一种有效的屏蔽方法。
-
WordPress企业主题近期,国内WordPress社群似乎进入了一段相对宁静的时期,无论是活跃的用户群体还是勤勉的开发者们,都呈现出一种沉稳的态势。在这样一个略显静谧的时刻,追格团队选择利用这段时间沉潜下来,专心致志地精进自身的产品,力求在每一个细节上都追求完善,以备在不久的将来,以更加超凡脱俗的面貌回馈给广大用户与开发者。
-
追格小程序建圈、发帖、商城发布商品报错 Warning: Undefined variable $result in追格小程序建圈、发帖、商城发布商品报错Warning: Undefined variable $result in /www/wwwroot/xly/wp-content/plugins/zhuige-xcx/public/class-zhuige-xcx-public.php on line 159
-
【重要通知】追格小程序更新提示因uni组件更新,追格小程序部分模块样式出现异常。我们已定位问题并正优化中,给您带来不便敬请谅解。感谢支持与理解!追格团队将持续努力,优化产品体验,期待更快与您相见。
-
微信小程序打开任意公众号文章 wx.openOfficialAccountArticlewx.openOfficialAccountArticle是微信小程序通过小程序打开任意公众号文章api,不包括临时链接等异常状态下的公众号文章,必须有点击行为才能调用成功。
-
追格小程序V2.5.0更新发布追格小程序V2.5.0版本的更新,我们没给大家添太多新花样,主要是把“内功”练好了。我们认真检查了上一版里那些组件之间的小摩擦,一点点地调整、优化,搞定了超过40多个小地方。这样一来,小程序跑起来就更顺畅了,大家用起来也会感觉更舒服、更顺手。这次虽然没大张旗鼓,但确实是让产品站得更稳、更可靠了。
暂无评论,抢个沙发...