Figma 学习笔记 – Frame


Frame = <div>

Frame 就类似 HTML 中的 div, 它和形状 rectangle 特性上蛮相识的, 但是使用场景其实差很多, 所以不要搞错哦. (除了图片很少会用到 rectangle 的)

Keyboard F 或者右上角选 Frame 就可以画出一个 frame 了.

 

Frame 基本配置

上面是 frame 的全部基本配置. 我们一个一个看.

 

第 1 个是可以选常用的 frame 尺寸, 比如 iPhone, Android 手机尺寸

第 2, 3 是 width height 对调

第 4 是把 frame 变成一个 wrapper, 修改 frame dimension 依据 wrap 它的内容.

 

x, y 坐标, 它这个对的点是中心点哦. 0, 0 的时候是在正中间. 一般上很少会手动调这个.

 

 

配置 width, height

它有一个小技巧哦, 可以直接写简单 formula 比如 197 + 50, 它会算出答案然后赋值.

右边的 icon 是一个锁定比例, 开启之后修改其中一个 dimension, 另一个会依据比例自动一起修改.

 

 

第 1 个是 frame 的角度旋转

第 2 个是调 frame 的圆角 border-radius (4边)

右边的小 icon 可以指定每一个角不同的 radius

 

 

隐藏/显示超出 frame 的内容. frame 就像 div 当内容过长的时候可以有 scroll bar 的概念.

 

 

 

 

 

 

 

 

 

 

 

 

 

 


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM