微网站首页代码

Original 2019-01-16 20:37:36 312
abstract:<!--index.wxml--> <view style="background-color:#A0A0A0;height:165px"> <swiper indicator-dots = "true" indicator-color = "#fff" au
<!--index.wxml-->
<view style="background-color:#A0A0A0;height:165px">
<swiper
indicator-dots = "true"
indicator-color = "#fff"
autoplay = "true"
circular = "true"
class = "slide-swiper"
>
<swiper-item>
<image src="http://47.107.161.34/upload/20190113/8369072ef6db6e628c252d9fefcc40fc.jpg" class="slide-image"></image>
</swiper-item>
<swiper-item>
<image src="http://47.107.161.34/upload/20190113/f03bbf70c00cf4988282ad2f9c88afb4.png" class="slide-image"></image>
</swiper-item>
<swiper-item>
<image src="http://47.107.161.34/upload/20190113/84e9570b00d0e83b273f88aae4e054ee.jpg" class="slide-image"></image>
</swiper-item>
</swiper>
</view>

<view class="hot">热门新闻</view>
<view class="hot-div">
<view>
<image src="http://47.107.161.34/upload/20190113/6a8819a80e2abc205ed45e6078cc75ee.jpg" class="hot-img"></image>
</view>
<view class="hot-right-div">
<view class="hot-title">甄子丹为辱华品牌走秀 仅仅10秒钟引发轩然大波
</view>
<view class="hot-add-time">2019-01-13</view>
</view>
</view>

<view class="hot-div">
<view>
<image src="http://47.107.161.34/upload/20190113/6a8819a80e2abc205ed45e6078cc75ee.jpg" class="hot-img"></image>
</view>
<view class="hot-right-div">
<view class="hot-title">甄子丹为辱华品牌走秀 仅仅10秒钟引发轩然大波
</view>
<view class="hot-add-time">2019-01-13</view>
</view>
</view>
<!-- <view class="container">
  <view class="userinfo">
    <button wx:if="{{!hasUserInfo && canIUse}}" open-type="getUserInfo" bindgetuserinfo="getUserInfo"> 获取头像昵称 </button>
    <block wx:else>
      <image bindtap="bindViewTap" class="userinfo-avatar" src="{{userInfo.avatarUrl}}" mode="cover"></image>
      <text class="userinfo-nickname">{{userInfo.nickName}}</text>
    </block>
  </view>
  <view class="usermotto">
    <text class="user-motto">{{motto}}</text>
  </view>
</view> -->
/**index.wxss**/
.userinfo {
display: flex;
flex-direction: column;
align-items: center;
}

.userinfo-avatar {
width: 128rpx;
height: 128rpx;
margin: 20rpx;
border-radius: 50%;
}

.userinfo-nickname {
color: #aaa;
}

.usermotto {
margin-top: 200px;
}
.slide-swiper{
height:160px;
}
.slide-image{
width:100%;
}
.hot{
font-size:14px;
color:rgb(223, 104, 68);
font-weight:bold;
line-height:20px;
margin:3px;
}

.hot-div{
width:100%;
height:100px;
/* background-color:red; */
}

.hot-img{
width:36%;
height:90px;
margin:5px;
float:left;
}
.hot-right-div{
height:80px;
width:60%;
float:right;
/* background-color:blue; */
}
.hot-title{
font-size:16px;
float:left;
font-weight:bold;
margin-top:5px;
margin-right:3px;
}
.hot-add-time{
font-size:10px;
float:left;
margin:10px 10px;
}

A5OKZOYDUV2FC0MXSI921ZS.png

Correcting teacher:天蓬老师Correction time:2019-01-17 09:01:52
Teacher's summary:代码写得不错, 配图更精彩, 有空多看看官方文档

Release Notes

Popular Entries