本文给大家带来的是微信小程序企业版新闻资讯文章正文设计制作开发教程，制作好以后效果图如下：
一、wxml页面代码如下：
<view class="new">
<view class="biaoti">韩媒：美军卡尔·文森号航母即将进入半岛海域</view>
<view class="riqi">
<text>网易新闻</text>
<text> 2017-4-27</text>
</view>
<view class="news">
韩联社25日援引韩国政府有关人士的话称，前往朝鲜半岛的美国核动力航母“卡尔•文森”号即将进入半岛东部海域，并将在本周末与韩国海军举行高强度联合训练。
<image src="../../images/shop.png"></image>
<text class="nei">
据报道，航母战斗群由“卡尔·文森”号航母、两艘驱逐舰和一艘导弹巡洋舰组成，将和韩国海军进行机动训练以及应对朝鲜发射的导弹探测、追踪和拦截训练。
报道称，预计“卡尔·文森”号将于26、27日左右进入朝鲜半岛东部海域。有关人士还表示：“朝鲜可能以25日建军节为契机，进行核试验或发射洲际导弹。高强度联合训练就是为了遏制这些‘挑衅’。”这名人士还解释说，这次训练传达出这样一个信息，朝鲜进行“挑衅”时将被严惩。</text>
</view>
</view>
|
二、wxss样式文件代码如下：
.biaoti{
text-align: center;
padding: 30rpx 50rpx;
font-weight: 700;
line-height: 60rpx;
padding-bottom: 10rpx;
}
.riqi{
margin-left: 20rpx;
text-align: center;
font-size: 28rpx;
color: #ccc;
margin: 0 auto;
padding-bottom: 20rpx;
}
.news{
text-indent: 75rpx;
margin: 0 20rpx;
font-size: 34rpx;
line-height: 47rpx;
}
.news image{
width: 100%;
padding: 20rpx 0;
}
.nei{
text-indent: 70rpx
}
|
三、js页面代码如下：
// pages/news/news.js
Page({
data:{},
onLoad:function(options){
// 页面初始化 options为页面跳转所带来的参数
},
onReady:function(){
// 页面渲染完成
},
onShow:function(){
// 页面显示
},
onHide:function(){
// 页面隐藏
},
onUnload:function(){
// 页面关闭
}
})
|
.jpg)
.jpg)
