登录 注册

建议提供一种限制图片插入时默认尺寸的设置

本贴最后更新于 655 天前，其中的信息可能已经时移世改

今天新增了大量带图的笔记，感受到一个很不方便的地方。

图片插入正文的时候，默认显示的尺寸都很大，特别是手机截图这种长条状的图，插入时默认适应编辑器宽度，导致整张图变得非常非常的长，甚至需要往下翻页才能找到这张图片右侧的拖动条，使用图片右键菜单同样不方便。

使用思源笔记这么久了，几乎每插入一张图片之后都要费劲拖动把它调小，而我自己调整出来图片尺寸基本上也是比较固定的。如果有一种设置能限制一下插入图片时的默认尺寸，就能在大部分时候省略掉拖动图片调大小的操作，这样一来，往笔记里插图这个动作就会顺畅很多了。

  • 思源笔记

    思源笔记是一款隐私优先的个人知识管理系统，支持完全离线使用，同时也支持端到端加密同步。

    融合块、大纲和双向链接，重构你的思维。

    22211 引用 • 88740 回帖 • 7 关注
5 引用
图片可以自动设置宽度吗？ • JeffreyChen
图片默认宽度 CSS 代码再次失效（已解决） • wenbocn
请问复制的图片的默认大小可以设置吗 • mozhu
我希望拷贝图片到思源中时，默认都是居中的，有什么方式处理吗？ 希望优化一下手机端的图片显示比例
1 操作
deerain 在 2023-01-28 19:34:55 更新了该帖
3 关注
7 收藏
2 赞同
5 引用
1 操作
19 回帖
4
3
2
1.9k 656 95 790 3 4 23 306

相关帖子

19 回帖
建议提供一种限制图片插入时默认尺寸的设置

欢迎来到这里！

我们正在构建一个小众社区，大家在这里相互信任，以平等 • 自由 • 奔放的价值观进行分享交流。最终，希望大家能够找到与自己志同道合的伙伴，共同成长。

注册 关于
请输入回帖内容 ...
  • dayangstar •
    订阅者

    image.pngimage.png
    你好 请问下我把这个设置为 150px 但为什么默认情况下还是一张大的图片 但是我手动选择几个宽度 25%，50%，100% 都会缩放成一样大小 也就是 150px 呢

    我想的是每张图片都默认为 150px 但发现实现不了 还是需要手动调整一下宽度 不知道哪里出错了 感谢指教

    1 回复
  • 其他回帖
  • iamqiz • • 2 • 3 赞同 • 2 评论

    通过代码片段 css 固定图片宽度(百分比或绝对值两种形式)

    24-01-12 更新: v2.12.2 测试通过

    增加了 [data-node-id] 部分, 完整如下

    .protyle-wysiwyg [data-node-id] span.img[data-type="img"]{
width: 30%;
display:inline-block;
}

    23-09-09 更新:

    以下代码自 2.10.2 版本可用, 将 30% 改成 111px 可实现固定宽度, 见 Issue #8683 · siyuan-note/siyuan

    .protyle-wysiwyg span.img[data-type="img"]{
width: 30%;
display:inline-block;
}

    图片默认居左, 若想默认居中,inline-block 改成 block

    23-07-04 更新:

    .protyle-wysiwyg div[data-node-id] span.img[data-type="img"] img {
width: 110px;
}
```

    原始代码(已失效)

    
.protyle-wysiwyg span[data-type="img"]{
   max-width: 121px;
}
    3 回复
    1 引用
    6 操作
    iamqiz 在 2024-01-12 16:18:09 更新了该回帖
    iamqiz 在 2023-10-26 02:53:07 更新了该回帖
    iamqiz 在 2023-09-09 20:47:54 更新了该回帖
    iamqiz 在 2023-07-04 02:26:08 更新了该回帖 iamqiz 在 2023-01-29 13:28:56 更新了该回帖 iamqiz 在 2023-01-29 13:22:33 更新了该回帖
    可以嗷，我给设置成 50% 了，感谢
    PiChou • • 1 赞同
    真不错，实现了，感谢
    SuJun •
  • JeffreyChen •
    付费者 支持者 捐赠者

    用这个代码片段

    /* 图片居中 CSS片段 */
.p:has(span.img) { 
text-align:center;
}
  • deerain •
    订阅者 支持者 勇士 作者

    这样确实不错，既不用在设置菜单里新增令用户眼花的带参数设置项，又可以随时调整，无需进入设置菜单

  • 查看全部回帖
deerain
还好我技压全场
回帖
240
 帖子
56
 积分
10126

近期热议

推荐标签 标签

  • TensorFlow

    TensorFlow 是一个采用数据流图（data flow graphs），用于数值计算的开源软件库。节点（Nodes）在图中表示数学操作，图中的线（edges）则表示在节点间相互联系的多维数据数组，即张量（tensor）。

    20 引用 • 19 回帖 • 1 关注
  • Bug

    Bug 本意是指臭虫、缺陷、损坏、犯贫、窃听器、小虫等。现在人们把在程序中一些缺陷或问题统称为 bug（漏洞）。

    75 引用 • 1737 回帖 • 2 关注
  • LeetCode

    LeetCode（力扣）是一个全球极客挚爱的高质量技术成长平台，想要学习和提升专业能力从这里开始，充足技术干货等你来啃，轻松拿下 Dream Offer！

    209 引用 • 72 回帖 • 1 关注
  • Node.js

    Node.js 是一个基于 Chrome JavaScript 运行时建立的平台， 用于方便地搭建响应速度快、易于扩展的网络应用。Node.js 使用事件驱动， 非阻塞 I/O 模型而得以轻量和高效。

    139 引用 • 269 回帖 • 44 关注
  • JWT

    JWT（JSON Web Token）是一种用于双方之间传递信息的简洁的、安全的表述性声明规范。JWT 作为一个开放的标准（RFC 7519），定义了一种简洁的，自包含的方法用于通信双方之间以 JSON 的形式安全的传递信息。

    20 引用 • 15 回帖
  • SVN

    SVN 是 Subversion 的简称，是一个开放源代码的版本控制系统，相较于 RCS、CVS，它采用了分支管理系统，它的设计目标就是取代 CVS。

    29 引用 • 98 回帖 • 684 关注
  • 新人

    让我们欢迎这对新人。哦，不好意思说错了，让我们欢迎这位新人！
    新手上路，请谨慎驾驶！

    52 引用 • 228 回帖 • 1 关注
  • CSS

    CSS（Cascading Style Sheet）“层叠样式表”是用于控制网页样式并允许将样式信息与网页内容分离的一种标记性语言。

    197 引用 • 547 回帖
  • IPFS

    IPFS（InterPlanetary File System，星际文件系统）是永久的、去中心化保存和共享文件的方法，这是一种内容可寻址、版本化、点对点超媒体的分布式协议。请浏览 IPFS 入门笔记了解更多细节。

    21 引用 • 245 回帖 • 247 关注
  • jQuery

    jQuery 是一套跨浏览器的 JavaScript 库，强化 HTML 与 JavaScript 之间的操作。由 John Resig 在 2006 年 1 月的 BarCamp NYC 上释出第一个版本。全球约有 28% 的网站使用 jQuery，是非常受欢迎的 JavaScript 库。

    63 引用 • 134 回帖 • 726 关注
  • C

    C 语言是一门通用计算机编程语言，应用广泛。C 语言的设计目标是提供一种能以简易的方式编译、处理低级存储器、产生少量的机器码以及不需要任何运行环境支持便能运行的编程语言。

    85 引用 • 165 回帖
  • 笔记

    好记性不如烂笔头。

    308 引用 • 793 回帖
  • 开源

    Open Source, Open Mind, Open Sight, Open Future!

    408 引用 • 3573 回帖
  • 黑曜石

    黑曜石是一款强大的知识库工具，支持本地 Markdown 文件编辑，支持双向链接和关系图。

    A second brain, for you, forever.

    15 引用 • 122 回帖 • 1 关注
  • 安装

    你若安好，便是晴天。

    132 引用 • 1184 回帖 • 1 关注
  • Python

    Python 是一种面向对象、直译式电脑编程语言，具有近二十年的发展历史，成熟且稳定。它包含了一组完善而且容易理解的标准库，能够轻松完成很多常见的任务。它的语法简捷和清晰，尽量使用无异义的英语单词，与其它大多数程序设计语言使用大括号不一样，它使用缩进来定义语句块。

    541 引用 • 672 回帖 • 1 关注
  • SQLServer

    SQL Server 是由 [微软] 开发和推广的关系数据库管理系统（DBMS），它最初是由 微软、Sybase 和 Ashton-Tate 三家公司共同开发的，并于 1988 年推出了第一个 OS/2 版本。

    19 引用 • 31 回帖
  • CodeMirror
    1 引用 • 2 回帖 • 127 关注
  • Wide

    Wide 是一款基于 Web 的 Go 语言 IDE。通过浏览器就可以进行 Go 开发，并有代码自动完成、查看表达式、编译反馈、Lint、实时结果输出等功能。

    欢迎访问我们运维的实例： https://wide.b3log.org

    30 引用 • 218 回帖 • 629 关注
  • AngularJS

    AngularJS 诞生于 2009 年，由 Misko Hevery 等人创建，后为 Google 所收购。是一款优秀的前端 JS 框架，已经被用于 Google 的多款产品当中。AngularJS 有着诸多特性，最为核心的是：MVC、模块化、自动化双向数据绑定、语义化标签、依赖注入等。2.0 版本后已经改名为 Angular。

    12 引用 • 50 回帖 • 474 关注
  • frp

    frp 是一个可用于内网穿透的高性能的反向代理应用，支持 TCP、UDP、 HTTP 和 HTTPS 协议。

    20 引用 • 7 回帖 • 1 关注
  • 学习

    “梦想从学习开始，事业从实践起步” —— 习近平

    169 引用 • 506 回帖 • 1 关注
  • 又拍云

    又拍云是国内领先的 CDN 服务提供商,国家工信部认证通过的“可信云”，乌云众测平台认证的“安全云”，为移动时代的创业者提供新一代的 CDN 加速服务。

    21 引用 • 37 回帖 • 544 关注
  • Dubbo

    Dubbo 是一个分布式服务框架，致力于提供高性能和透明化的 RPC 远程服务调用方案，是 [阿里巴巴] SOA 服务化治理方案的核心框架，每天为 2,000+ 个服务提供 3,000,000,000+ 次访问量支持，并被广泛应用于阿里巴巴集团的各成员站点。

    60 引用 • 82 回帖 • 599 关注
  • Netty

    Netty 是一个基于 NIO 的客户端-服务器编程框架，使用 Netty 可以让你快速、简单地开发出一个可维护、高性能的网络应用，例如实现了某种协议的客户、服务端应用。

    49 引用 • 33 回帖 • 23 关注
  • 开源中国

    开源中国是目前中国最大的开源技术社区。传播开源的理念，推广开源项目，为 IT 开发者提供了一个发现、使用、并交流开源技术的平台。目前开源中国社区已收录超过两万款开源软件。

    7 引用 • 86 回帖
  • 链书

    链书（Chainbook）是 B3log 开源社区提供的区块链纸质书交易平台，通过 B3T 实现共享激励与价值链。可将你的闲置书籍上架到链书，我们共同构建这个全新的交易平台，让闲置书籍继续发挥它的价值。

    链书社

    链书目前已经下线，也许以后还有计划重制上线。

    14 引用 • 257 回帖

最新标签