魏敏_2/66学习笔记

已经深刻掌握的知识点如下

知识点A:display:flex和inline-flex的区别:

flex的作用对象是block级元素
inline-flex的作用对象是inline级元素

知识点B:display:none与flex item中使用visibility:collapse的区别

  1. visibility:visible(可见)/hidden(隐藏并留空位)/collapse (表格元素中使用,可删除行列,并把空间给其他内容,不影响表格布局,如果此值被用在其他的元素上,会呈现为 "hidden" )
  2. display:none(不占用文档流中的位置,不留空位)
  3. 在flex item中,设置visibility:collapse与display:none 的效果一样(chrome中collapse与hidden相同,在FF和edge可用)
  4. 推荐用display:none

基本掌握,但还有一些点需要深入的知识点如下:

知识点C:隐藏的flex item的最小宽度和最小高度

  1. flex items有默认的最小尺寸(min-width:auto; min-height:auto)
  2. automatic minimum size:一般取决于content size和specified size中更小的那个值;但在盒子有宽高比且没有specified size时,取决于content size和transferred size中更小的一个。

问题C1:我理解的
specified size:给定尺寸
transferred size:固定宽高比(如input标签大小)
content size:内容区域的大小
是这个意思吗?

知识点D:次序和方向

  1. flex-direction:row | row-reverse | column | column-reverse
  2. flex-wrap:nowrap | wrap | wrap-reverse
  3. flex-flow:flex-direction || flex-wrap(初始值:row nowrap)
  4. order: integer(初始值为0,改变items的排列顺序,数字越小 )
    1) 适用于flex items和flex containers中定位为absolutely-positioned children
    2)order只改变视觉顺序,不改变文档流中的顺序

初步掌握,还需要再次反复学习的知识点如下:

关于该知识点有以下疑问
问题E:flex lines


leetcode

leetcode完成的任务编号为:9

leetcode做到一半的任务编号为:14

leetcode中遇到的问题包括:

问题描述:寻找最长公共前缀的算法有问题

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • H5移动端知识点总结 阅读目录 移动开发基本知识点 calc基本用法 box-sizing的理解及使用 理解dis...
    Mx勇阅读 4,639评论 0 26
  • 移动开发基本知识点 一.使用rem作为单位 html { font-size: 100px; } @media(m...
    横冲直撞666阅读 3,523评论 0 6
  • 已经深刻掌握的知识点如下 知识点A:flex line flex items 在flex container中按f...
    kayleeWei阅读 206评论 0 0
  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 13,815评论 1 92
  • 整天,手机上,公众号里都满是先生。看着先生儒雅,看着先生淡然,看着先生一次一次与爱人离别。先生的痛,全写在着柔和...
    那年凌汛阅读 173评论 0 3