零基础前端自学入门：小程序UI容器组件

这是一节以UI布局、容器组件的使用为主题的live，专注于布局与容器这一个点，努力把这一点讲透。这是继4月22日整体入门live“零基础周末学习小程序开发”之后，从小处着眼、细处学习的尝试。

以下是课堂计划：

  1. 最流行的布局之flex布局讲解，附《讲义：flex布局.pdf》分享
  2. flex布局实践，讲解view、scroll-view、swiper、cover-view等组件的使用，附《讲义：小程序容器组件布局实践.pdf》分享，附demo源码分享
  3. 问答：什么是flex布局？
  4. 问答：如何理解flex-wrap的属性值wrap-reverse？
  5. 问答：如何调整侧轴方向上某个子元素的对齐方式，实现琴键按下的效果？
  6. 问答：如何记忆align-items与justify-content谁是主轴谁是副轴？
  7. 问答：如何实现边栏宽度固定，其余部分自由伸展的布局？
  8. 问答：有哪些属性是调整子元素个体行为的？
  9. 问答：flex做为属性值和属性名的不同？
  10. 问答：当flex-direction为row时，justify-content、align-items和align-content各有哪些表现？

会有两篇讲义，有一个独立的随堂demo分享：

以上资料，仅限于参加live的同学下载学习，请勿外传分享。

参加这节课，请戳这里：零基础前端自学入门：小程序UI容器组件

微信小程序 | 51，live新课“小程序UI容器组件”的课堂计划的更多相关文章

  1. 微信小程序，创业新选择

    微信小程序,创业新选择 创业者们 总是站在时代的风口浪尖,他们踌躇满志无所畏惧,这大概就是梦想的力量.但是,如果没有把梦想拆解成没有可预期的目标和可执行的实现路径那么一切都只能叫做梦想. 小程序 张小 ...

  2. 微信小程序之提高应用速度小技巧

    作者:vicyao, 腾讯web前端开发 高级工程师商业转载请联系腾讯WeTest获得授权,非商业转载请注明出处. 原文链接:http://wetest.qq.com/lab/view/294.htm ...

  3. 微信小程序怎样提高应用速度小技巧

    作者:vicyao, 腾讯web前端开发 高级工程师商业转载请联系腾讯WeTest获得授权,非商业转载请注明出处. 原文链接:http://wetest.qq.com/lab/view/294.htm ...

  4. 微信小程序开发教程 #043 - 在小程序开发中使用 npm

    本文介绍了如何在微信小程序开发中使用 npm 中包的功能,大大提高微信小程序的开发效率,同时也是微信小程序系列教程的视频版更新. 微信小程序在发布之初没有对 npm 的支持功能,这也是目前很多前端开发 ...

  5. 微信小程序开发——打开另一个小程序

    微信小程序打开另一个小程序,有两种方法:1.超链接:2.点击按钮. 全局配置: 跳转到其他小程序,需要在当前小程序全局配置中配置需要跳转的小程序列表,代码如下: App.json { ... &quo ...

  6. Authing新功能——小程序扫码登录

    近期,Authing 发布了新功能--小程序扫码登录. 小程序扫码登录指使用Authing小程序身份管家在网页端或其它客户端执行微信登录,目前的SDK仅支持客户端JavaScript.其它语言若想使用 ...

  7. 微信小程序开发公测，小程序账号申请办法攻略

    11月3号晚上 10 点,微信公众平台发布公告,宣布微信小程序正式开放公测.此次小程序公测允许开发者将产品提交至微信公众平台审核,但是暂时不支持发布,也就是说普通消费者若想体验小程序,还需要等待一段时 ...

  8. 挑战App Store，微信通过“跳一跳”秀了一下“小程序”的肌肉

    2017年即将结束的时候,微信放了一个大招.随着最新的微信v6.6.1版本更新,基于小程序的"小游戏"板块正式上线.微信上首发的这款"小游戏"叫"跳一 ...

  9. 微信小程序开发——前端如何区分小程序运行环境

    前言: 之前用vue做h5项目,对于接口请求,都是根据前端访问域名来判断运行环境,然后自动适配对应的服务器地址的.这样的好处就是在开发.测试及发布上线全程都不需要手动去改接口请求地址,只要提前配置好就 ...

随机推荐

  1. CentOS 7.0 各版本下载说明 新增Everything版

    CentOS-7.0-1406有很多可供选择的版本,对初学者来说,不知如何选择,下面做简单的介绍: CentOS-7.0-1406-x86_64-DVD.iso 标准安装版,一般下载这个就可以了 Ce ...

  2. 使用BaiDu Java Script Web Api 在Web开发中嵌入地图使用步骤

    前言 很多做企业网站的朋友,都喜欢有一个关于我们.联系我们的栏目,那么这个栏目放什么内容才能饱满那,只有放个地图才显得有点高大上. 一.产生并复制访问Api的密钥(AK) 1.首先我们需要注册一个百度 ...

  3. Java UUID Generator(JUG)

    UG 是一个纯 Java 的 UUID 生成器. UUID是指在一台机器上生成的数字,它保证对在同一时空中的所有机器都是唯一的.通常平台会提供生成UUID的API.UUID按照开放软件基金 会 (OS ...

  4. IOS 加载更多数据中

    /**点击添加*/ - (IBAction)loadBtnClick { //1.隐藏加载按钮 self.loadBtn.hidden=YES; //2.显示“正在加载” self.loadingVi ...

  5. IOS 设置ipone状态栏的样式

    /** 控制状态栏的样式 */ -(UIStatusBarStyle)preferredStatusBarStyle { //白色 return UIStatusBarStyleLightConten ...

  6. 使用loadrunner 12 手动关联

    关联的含义: 如浏览器打发送一个网页A请求,服务器返回这个请求,并且在返回的内容中携带一个session id=key,当浏览器再送出网页B的请求时,这时就要用ID=key的数据,服务器才会认为这是合 ...

  7. Codeforces 758D Ability To Convert（区间DP）

    题目链接:http://codeforces.com/problemset/problem/758/D 题意:一个n进制下的数k,其中k不会用字母,如果有A就用10代替了.求k这个数对应的,在10进制 ...

  8. Python-程序模块化

    一.程序模块化 一个程序可能需要导入自己写的模块,或者需要导入.查找.修改文件等操作.当把程序移植到其他路径执行时,会因为模块或文件路径的变化而报错. 程序模块化,就是将整个程序(包含该程序需要用到的 ...

  9. P3391 【模板】文艺平衡树（Splay）

    Splay #include<cstdio> #include<algorithm> #include<iostream> using namespace std; ...

  10. 17、SpringBoot------整合dubbo

    SpringBoot整合Dubbo+Zookeaper 1.安装运行zookeeper (1)下载zookeeper 官网:http://zookeeper.apache.org/ (2)解压缩 (3 ...