【微信小程序】制作个人信息页面

题外：
也许前端学习也应包括审美。在我学习前端路上，以前模仿视频内容，现在模仿别人成品…我曾想过作为前端是不是也应学习UI设计方向的美术知识，再不济也应具备页面布局的审美。但这个想法被一位大佬否定了，所以这个想法也只好放在心里成为另一种可能。

分享一个今天才学会的CSDN写文章的技巧~

正题：

先上成品图

1.架构

进行编程前，我们要架构。对整体项目叫架构，对一个页面而言不如说叫整理思路

以本图为例，除去底部 tabBar，头部 navigationStyle 是小程序特有配置，其他都是“前端三剑客”的基础内容。

于是可以简单的划分为两部分：

1. 蓝色背景区域
2. 白色主体区域

思维导图附上：

注意：开发时绝对定位尽量少用。

2.编程

前排提示：代码可以复制到 VScode 看的舒服很多

第一步：根据架构写出布局

  
  






1
2
3
4
5
6
7
8
9

第二步：分析盒子内具体内容

  
    
    
      
      
    
    
    
      
      
        
      
      
      
        访客学院
      
    
  
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

第三步：写CSS样式，通常我会第二步第三步同时进行

CSS基础我也很菜，而且实现的方式很多，提示一下 不多赘述。

1. 子绝父相
2. margin - left
3. 用 line - height 撑开盒子高度，而不是给盒子设置高度
4. justify - content : space - betweem 了解下它的全部值

先自我介绍一下，小编13年上师交大毕业，曾经在小公司待过，去过华为OPPO等大厂，18年进入阿里，直到现在。深知大多数初中级java工程师，想要升技能，往往是需要自己摸索成长或是报班学习，但对于培训机构动则近万元的学费，着实压力不小。自己不成体系的自学效率很低又漫长，而且容易碰到天花板技术停止不前。因此我收集了一份《java开发全套学习资料》送给大家，初衷也很简单，就是希望帮助到想自学又不知道该从何学起的朋友，同时减轻大家的负担。添加下方名片，即可获取全套学习资料哦