KISS Translator(简约翻译)自定义译文样式

/ 67 阅读 / 0

简单介绍一下这个插件:

KISS Translator(也叫"简约翻译")是一款开源、免费、简约主义的 Chrome/Edge/Firefox 浏览器翻译扩展(同时也有油猴脚本版本),由开发者 FishJar​开发维护,源码托管在 GitHub:github.com/fishjar/kiss-translator

插件自带的那些样式设置找不到我中意的,所以就写一个。

/* ===== KISS Translator:整段译文块化 ===== */

/* 强制译文段变成块级 */
display: block !important;

/* 淡色背景框 */
background: rgba(255, 0, 0, 0.045);          /*(明度很低的颜色叠加)*/
border-radius: 6px;
padding: 12px;
margin: 4px 0;
/* 译文文字颜色稍微柔一点,和原文拉开层次 */
color: #444;

/* 悬停微微强调,方便肉眼确认哪块是译文 */
&:hover {
  background: rgba(255, 0, 0, 0.07);
  border-color: rgba(0, 0, 0, 0.14);
}

到插件设置-> 样式设置,“+” 号添加一个新样式,将这段 css 复制粘贴进去,保存就好。

这个 css 在 “原文+译文” 的翻译模式好用。