参考：

Figma Tutorial: Images

3 Ways to Insert Image

1. rectangle / frame + fill

画一个 rectangle / frame 然后去 fill 选择 image then browse an image to insert.

注: rectangle 就是 HTML 的 <img>, frame 就是 HTML 的 div + background-image

2. ctrl + shift + k

使用 keyboard shortcut 可以快速实现第 1 个 way

3. drag & drop, copy & paste

图片配置

Fill 是 css 的 cover (填满框, 牺牲图片的内容)

Fit 是 css 的 contain (保留所有图片内容, 让框留白)

Crop 是截图咯

Tile 是重复图片填满框

右边是旋转

下半段的配置就是亮度, 倒影等等了

Figma 学习笔记 – Image的更多相关文章

  1. js学习笔记：webpack基础入门（一）

    之前听说过webpack,今天想正式的接触一下,先跟着webpack的官方用户指南走: 在这里有: 如何安装webpack 如何使用webpack 如何使用loader 如何使用webpack的开发者 ...

  2. PHP-自定义模板-学习笔记

    1.  开始 这几天,看了李炎恢老师的<PHP第二季度视频>中的“章节7:创建TPL自定义模板”,做一个学习笔记,通过绘制架构图.UML类图和思维导图,来对加深理解. 2.  整体架构图 ...

  3. PHP-会员登录与注册例子解析-学习笔记

    1.开始 最近开始学习李炎恢老师的<PHP第二季度视频>中的“章节5:使用OOP注册会员”,做一个学习笔记,通过绘制基本页面流程和UML类图,来对加深理解. 2.基本页面流程 3.通过UM ...

  4. 2014年暑假c#学习笔记目录

    2014年暑假c#学习笔记 一.C#编程基础 1. c#编程基础之枚举 2. c#编程基础之函数可变参数 3. c#编程基础之字符串基础 4. c#编程基础之字符串函数 5.c#编程基础之ref.ou ...

  5. JAVA GUI编程学习笔记目录

    2014年暑假JAVA GUI编程学习笔记目录 1.JAVA之GUI编程概述 2.JAVA之GUI编程布局 3.JAVA之GUI编程Frame窗口 4.JAVA之GUI编程事件监听机制 5.JAVA之 ...

  6. seaJs学习笔记2 – seaJs组建库的使用

    原文地址:seaJs学习笔记2 – seaJs组建库的使用 我觉得学习新东西并不是会使用它就够了的,会使用仅仅代表你看懂了,理解了,二不代表你深入了,彻悟了它的精髓. 所以不断的学习将是源源不断. 最 ...

  7. CSS学习笔记

    CSS学习笔记 2016年12月15日整理 CSS基础 Chapter1 在console输入escape("宋体") ENTER 就会出现unicode编码 显示"%u ...

  8. HTML学习笔记

    HTML学习笔记 2016年12月15日整理 Chapter1 URL(scheme://host.domain:port/path/filename) scheme: 定义因特网服务的类型,常见的为 ...

  9. DirectX Graphics Infrastructure(DXGI):最佳范例 学习笔记

    今天要学习的这篇文章写的算是比较早的了,大概在DX11时代就写好了,当时龙书11版看得很潦草,并没有注意这篇文章,现在看12,觉得是跳不过去的一篇文章,地址如下: https://msdn.micro ...

  10. ucos实时操作系统学习笔记——任务间通信（消息）

    ucos另一种任务间通信的机制是消息(mbox),个人感觉是它是queue中只有一个信息的特殊情况,从代码中可以很清楚的看到,因为之前有关于queue的学习笔记,所以一并讲一下mbox.为什么有了qu ...

随机推荐

  1. AT_arc041_b 题解

    洛谷链接&Atcoder 链接 本篇题解为此题较简单做法及较少码量,并且码风优良,请放心阅读. 题目简述 给定一个 \(N \times M\) 的矩阵,此矩阵的每一个元素都向上.下.左.右 ...

  2. 单细胞测序最好的教程（十）：细胞类型注释迁移｜万能的Transformer

    作者按 本章节主要讲解了基于transformer的迁移注释方法TOSICA,该算法在迁移注释上达到了SOTA的水平,在注释这么卷的赛道愣是杀出了一条血路.本教程首发于单细胞最好的中文教程,未经授权许 ...

  3. python项目位置迁移后，虚拟环境无法使用

    一.虚拟环境无法使用问题 修改虚拟环境目录/pyvenv.cfg文件中的路径 建议以下配置全部替换一下 修改虚拟环境目录/scripts/activate.bat文件中** VIRTUAL_ENV参数 ...

  4. 2024-07-27：用go语言，给定一个正整数数组，最开始可以对数组中的元素进行增加操作，每个元素最多加1。 然后从修改后的数组中选出一个或多个元素，使得这些元素排序后是连续的。 要求找出最多可以选

    2024-07-27:用go语言,给定一个正整数数组,最开始可以对数组中的元素进行增加操作,每个元素最多加1. 然后从修改后的数组中选出一个或多个元素,使得这些元素排序后是连续的. 要求找出最多可以选 ...

  5. 记一次springboot整合rabbitMQ的list序列化问题

    问题:平时传一个类的时候都会继承Serializable实现正确传输,这次我把list<Object>直接丢成了message,导致rabbitMQ不能序列化对象.报错 org.sprin ...

  6. 浅谈Git架构和如何避免代码覆盖的事故

    浅谈Git架构和如何避免代码覆盖的事故 Git 不同于 SVN 的地方在于, Git 是分布式的版本管理系统, 所有的客户端和服务器都保存了一份代码, 涉及到仓库仓之间的同步, 所以处理不当极易造成冲 ...

  7. Microsoft Dynamics CRM 插件被限制2分钟超时解决方案

    背景: 在隔离模式"沙箱"中运行的插件或自定义工作流活动将有2分钟的硬限制.如果你的插件很复杂,需要超过2分钟,有一些解决方法. CRM on premise (本地版) 选择插件 ...

  8. FindBugs质量管理

    1. FindBugs是什么 FindBugs 是一个静态分析工具,它检查类或者 JAR 文件,将字节码与一组缺陷模式进行对比以发现可能的问题.有了静态分析工具,就可以在不实际运行程序的情况对软件进行 ...

  9. 安装RabbitMQ遇到的一些坑

    Ubantu18.0正确安装RabbitMQ 1.安装erlang 因为RabbitMQ需要erlang语言的支持,所以我们需要先安装erlang. sudo apt-get install erla ...

  10. CUDA常见编译器配置问题一览

    CUDA常见编译器配置问题一览 关注TechLead,复旦博士,分享云服务领域全维度开发技术.拥有10+年互联网服务架构.AI产品研发经验.团队管理经验,复旦机器人智能实验室成员,国家级大学生赛事评审 ...