如何使用 Tampermonkey 更改“max-h-80 Overflow-y-hidden”内的“最大高度”？

Question

显然，我第一次尝试使用 Tampermonkey 时一直在挣扎。 Bato.to 评论部分仅加载 PC 上图像的前 280 个像素左右，我希望将其加倍，以更接近大多数用户的移动视图。 在找到合适的变量后，我现在一直在努力使改变永久化； Tampermonkey 似乎是最简单的解决方案，但我对“新”F12 布局和网站编码还不够熟悉，无法制作我能找到的任何用户脚本。

网站F12查看 基本上，我想做的就是在

内

<div class="max-h-80 overflow-y-hidden">

改变

.max-h-80 {
    max-height: 20rem;

遗憾的是，我无法找到任何关于如何完成这项工作的帮助。 max-height 不被接受为功能变量，并且我发现使用 maxHeight 的解决方案在实际更改网站上的值时不起作用。

Answer 1

您要更改的是页面的样式，即CSS。 Tampermonkey 有很多方法可以做到这一点，最简单的方法是 GM_addStyle。

重要的部分是匹配正确的窗口，在这种情况下，注释位于自己的 iframe 中，网址如下：

https://bato.to/embeds/comments?comicId=XXXXX&chapterId=XXXXXXX

。

要匹配您可以使用该格式的所有网址：

https://bato.to/embeds/comments*

// ==UserScript==
// @name         expand bato.to comments
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  .
// @author       You
// @match        https://bato.to/embeds/comments*
// @icon         https://www.google.com/s2/favicons?sz=64&domain=bato.to
// @grant        GM_addStyle
// ==/UserScript==

GM_addStyle('div[name=comment-post-display] .max-h-80 { max-height: unset; }');

---

GM_addStyle 使用 css div[name=comment-post-display] .max-h-80 { max-height: unset; } 插入一个新的

Style 元素

，这个 selector 将匹配具有类 div[name=comment-post-display] 的

max-h-80

的所有

后代

，并将其 max-height 设置为 unset .

要设置特定的

max-height

，只需将

unset

更改为任何有效值，例如：

max-height: 100rem;