问题描述
在 Zim 中,当在页面中插入图片后,由于页面是白色的,并且图片背景也是白色的,导致我们无法直观的看出图片与段落的距离。在这种情况下,图片与段落可能间隔一行,也可能间隔两行,这对页面的排版造成影响。
我们希望,直接看到图片与段落的间隔。比如:通过为图片设置边框(Border)等方式,来凸显图片的边界。
该笔记将记录:在 Zim 中,如何突出显示图片(以明确图片与段落的间隔),以及常见问题的处理。
解决方案
方案一、修改页面背景色
通过设置页面的背景色,页面与图片的形成反差,将显示出图片的边界:
/* 在 ~/.config/gtk-3.0/gtk.css 中,添加如下配置 */ #zim-pageview text { background-color: darkseagreen; /* changes the background color of the Zim's page editor */ /* color: #BABABA; */ /* foreground text color */ }
但是,该方法的局限性在于:如果图片为 PNG 透明图片,则图片将显示页面的背景色(因为是透明的),无法达到我们的目的。
方案二、为图片设置边框
我们可以为图片添加边框,这样便可看到图片的边界,区分出段落与图片的距离:
/* 在 ~/.config/gtk-3.0/gtk.css 中,添加如下配置 */ #zim-inserted-object { border: 2px solid #ccc; }
但是,该方法的局限性在于:“通过插件插入的图片”(比如 Graphviz、Sequence Diagram 等等)能够显示该边框,但是直接插入的图片无法显示边框。这与 Zim 实现有关:通过插件插入的图片,是通过 Gtk.Image() 与 Gtk.VBox() 插入 TextBuffer 的,而样式则是添加到 Gtk.VBox() 控件上;直接插入的图片,是通过 Pixbuf 插入到 TextBuffer 中的,没有设置边框;