lemooljiang avatar

链课手机端优化及更新

lemooljiang

Published: 13 Jan 2020 › Updated: 13 Jan 2020

链课手机端优化及更新

moochainphone.jpg

链课在样式方面是用的Bootstrap的框架,响应式的,对于不是特别复杂或是功能很多的网站,其实一站就可以了。在前端设计时只有调整下样式,就可以响应式的布局。也就是说,当电脑打开时会展示电脑端的样式,当用手机打开时会展示手机的样式。这比重新做个APP或是小程序要简单些。

在CSS样式中只需加上一段代码即可:

@media only screen and (max-width:768px) {
    h1{
      padding-left: 1rem;
    }
    #content{
      width: 95%;
    }
    .newtext{
      width: 90%;
      margin-left: 1rem;
    }

  }

关键是第一行代码:它会自动判断是不是手机端,如果是,则使用以下样式!

在做手机端优化时,也做了一些小更新:把封面图加上了,在其它前端(如steemit)加上了直达链课的链接......

Leave 链课手机端优化及更新 to:

Written by

Designer , Poet , Technology enthusiasts

Read more #moochain posts


Best Posts From lemooljiang

We have not curated any of lemooljiang's posts yet. But you can encourage our curation team to review posts by visiting them regularly and by referring other readers. Because we give priority to frequently read content.

More Posts From lemooljiang