微信小程序 WXML调用WXSS 错误！
WXML的代码<!--index.wxml-->
<view class="container">
<text class="text_style">树莓派客户端</text>
<buttonclass="con_style" type="primary" bindtap="connectPi">连接</button>
<!-- {{}}是微信小程序的一种语法，里面可以引用变量，因此把原来写死的文字做成变量方便后面改动，因为后面有可能需要点击了开灯按钮，文字信息会变成”关红灯” -->
<buttonclass="red_style"bindtap="redControl">{{redLed}}</button>
<buttonclass="green_style"bindtap="greenControl">{{greenLed}}</button>
<buttonclass="blue_style"bindtap="blueControl">{{blueLed}}</button>
<buttonclass="beep_style"bindtap="beepControl">{{beep}}</button>
</view>
WXSS的代码
/**index.wxss**/
/*pages/index/index.wxss */
.text_style{
color:green;
font-size:100rpx
}
.con_style{
width: 210rpx;
height: 210rpx;
line-height:210rpx;
opacity:unset;
text-align:center;/*为了文字左对齐*/
padding: 0rpx;/*为了文字左对齐*/
border-radius: 50%;
margin-top: 100rpx;
font-size:60rpx
}
.red_style{
width:160rpx;/*宽高一样，因为要做成圆形 */
height:160rpx;
margin-left: 60rpx;
margin-top: -100rpx;
border-radius: 50%;/*弧度,50%就是圆形了，50~100%之间观察不出来*/
background-color: red;
opacity: 1;/*透明度，打开后为1，关闭时0.3,一定要设置，背景色才可以露出来*/
line-height:160rpx;/*字体行高与按钮相等，目的是让字体居中*/
padding: 0rpx;/*为了让字体居中*/
color:white;/*字体颜色*/
}
.green_style{
width:160rpx;
height:160rpx;
margin-left: 200rpx;
margin-top: -20rpx;
border-radius: 50%;
background-color: green;
opacity: 1;
line-height:160rpx;
padding: 0rpx;
color:white;
}
.blue_style{
width:160rpx;
height:160rpx;
margin-left: 400rpx;
margin-top: -150rpx;
border-radius: 50%;
background-color: blue;
opacity: 1;
line-height:160rpx;
padding: 0rpx;
color:white;
}
.beep_style{
width:160rpx;
height:160rpx;
margin-left: 530rpx;
margin-top: -330rpx;
border-radius: 50%;
background-color: black;
opacity: 1;
line-height:160rpx;
padding: 0rpx;
color:white;
}
不知道为什么我的盒子模型的margin显示错误 ，但是其它的倒是正确。
我不知道是软件的BUG还是其它地方没有设计好。
希望万能的鱼油 帮我看看！
感激不尽{:10_277:} container 没有定义样式？是不是得来个flex
页:
[1]