小程序开发教程中view组件无法达到预期效果解决

最新推荐文章于 2024-11-14 09:18:45 发布

原创最新推荐文章于 2024-11-14 09:18:45 发布 · 650 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#小程序 #view

小程序专栏收录该内容

1 篇文章

订阅专栏

本文针对初学者在使用小程序view组件时遇到的问题提供了解决方案。通过在index.wxss文件中添加特定的样式代码，可以有效改变view组件的背景颜色等属性，实现预期的视觉效果。

有很多初学者在小程序入门过程中（https://mp.weixin.qq.com/debug/wxadoc/dev/component/view.html腾讯教程），在测试view组件时，发现无法达到预期效果，是因为index.wxss 中没有添加相应的样式，添加如下代码就行：

/**index.wxss**/
.bc_green{

    background:green;

}
.bc_red{

    background:red;

}
.bc_blue{

    background:blue;

}
.bc_yellow{

    background:yellow;

}
.flex-wrp{
 height: 100px;
 display:flex;
 background-color: #FFFFFF;
}
.flex-item{
 width: 100px;
 height: 100px;
}

得到效果：