全栈开发学习(Node+Vue+Mongodb)(九)——移动端页面搭建（详情页部分）

1 文章详情页

解决添加图片后宽度超出屏幕：添加max-width

.article{
  .body{
    img{
      max-width:100%;
      height: auto;
      }
    iframe{
        max-width:100%;
       height: auto;
      }
  }
}

2 英雄详情页

3 其他细节问题

• 时间格式转化：安装工具dayjs :npm i dayjs

{{news.createdAt | date}}

filters:{
    date(val){
        return dayjs(val).format('MM/DD')  //转化为月-日的格式
    }
  }

• 特殊意义的图标 如> <要用转义符