作者zonppp (冷凉卡好)
看板Japandrama
标题Re: [闲聊] 修改KKTV的字幕样式/大小
时间Wed Nov 12 22:54:50 2025
因为转到 line tv 看片所以又借原PO的经验修改了一下
无法萤幕截图手机拍差不多长这样
https://i.meee.com.tw/nfEGaPB.jpg
使用 stylus 扩充套件汇入以下设定
有厉害的网友可继续改
修正字幕太长会不置中的现像
-------------------------------------
@-moz-document url-prefix("
https://www.linetv.tw/drama/") {
/* TW:主字幕 JP:副字幕 */
/* 修改位置 副字幕 */
.vjs-text-track-cue-ja-JP-secondary {
position: absolute !important;
left: 50% !important;
right: auto !important;
bottom: 0 !important;
/* 调整位置 */
transform: translate(-50%, 45%) !important;
width: auto !important;
text-align: center !important;
}
/* 修改位置 主字幕 */
.vjs-text-track-cue-zh-TW-primary {
position: absolute !important;
left: 50% !important;
right: auto !important;
bottom: 0 !important;
/* 调整位置 */
transform: translate(-50%, -35%) !important;
width: auto !important;
text-align: center !important;
/* 主字幕 放大缩小 */
zoom: 1.1 !important;
}
/* 字幕特效 */
.vjs-text-track-cue-ja-JP-secondary div,
.vjs-text-track-cue-zh-TW-primary div {
/* 字形改变
font-family: Microsoft JhengHei UI !important; */
/* 字型颜色 */
color: #fff !important;
/* 字型透明度 */
opacity:.85 !important;
/* 不换行 */
white-space: nowrap !important;
/* 字型外框，? px 厚度 */
-webkit-text-stroke: 0.1px black !important;
/* 字型阴影 */
filter: drop-shadow(0 0 6px rgba(0,0,0,0.8))
drop-shadow(0 0 10px rgba(0,0,0,0.9)) !important;
}
}
-------------------------------------
※ 引述《narihira2000 (つよし)》之铭言：
: 各位板友大家好
: 最近开始用KKTV来看日剧
: 但是发现他们字幕的位置一定会在时间轴的上面
: 而且又不能调整字幕大小(其实可以透过ctrl+滚轮来调整，但也不方便)
: 再加上我看日剧时习惯把日文字幕开起来
: 双字幕直接快把画面占掉一半
: https://i.imgur.com/80shVIX.jpg
: 於是兴起想修改字幕样式的念头
: ==========================以上废话==========================
: 以下开始教学
: 简单来说就是透过stylus来调整字幕的css
: 1. 首先去扩充商店安装stylus扩充元件(chrome、firefox、edge皆有)
: 2. 点开stylus并点选"管理已安装样式"後编写一个新样式
: https://i.imgur.com/5yYTO9H.jpg
: https://i.imgur.com/bLRGU5F.jpg
: 3. 贴上以下网址的内容
: https://bit.ly/2ZDwohD
: 4. 在底部"适用於"的地方进行设定，让它只在kktv内运作
: 选项为 含以下前缀的网址
: 并输入以下两个网址 https://www.kktv.me/play/ https://kktv.me/play/
: https://i.imgur.com/6kuVSre.jpg
: 5. 储存後就完成啦!
: https://i.imgur.com/TxdfFbI.jpg
: 单一字幕也是支援的喔! 不过若是内嵌字幕就无法了XD
: https://i.imgur.com/2hpDcfb.jpg
: 当然也可以修改css的内容
: 像是字幕的外框颜色、大小、高低位置等等
: 或是字幕是否要一行显示
: 详细可以参考code内注解来进行调整
: 你甚至可以改成像这样(?
: https://i.imgur.com/f0zvdT3.jpg
: 总之懂CSS的人应该可以变出更多花样
: 就分享给板友们罗~
--
※ 发信站: 批踢踢实业坊(ptt.cc), 来自: 218.161.25.71 (台湾)
※ 文章网址: https://webptt.com/cn.aspx?n=bbs/Japandrama/M.1762959296.A.6B7.html
1F：→ batis: 之前网友分享的修改方式真的帮助很大 一直都有在用 来试试 11/13 00:13
3F：→ batis: 请问想要主字幕和副字幕 上下间距小一些 该调整哪个选项 11/13 00:47
4F：→ zonppp: bottom: 10px !important; 这一行 11/13 09:08
5F：推 dwdt: 太感谢了 回家试试 11/13 11:51
6F：推 batis: 感谢 字幕间距我会调了 想再请问 能单独调整主字幕或副字幕 11/13 13:23
7F：→ batis: 的大小吗，因为若更改LINE TV预设的字幕大小 它是主副字幕 11/13 13:25
8F：→ batis: 同时变大或变小 11/13 13:25
9F：→ zonppp: 因为 linetv 有一般模式 剧院模式 全萤幕 他的字型大小 11/13 15:35
10F：→ zonppp: 不同模式下大小都不一样 直接指定大小会三个模式都一样大 11/13 15:36
11F：→ zonppp: "css 除了用 font size 还有什麽方法让字变大或缩小?" 11/13 15:38
12F：→ zonppp: 你用这个问题去问 chatgpt 它会给你几个方法让你试 11/13 15:39
13F：→ zonppp: 你加注新的设定 记得结尾加!important才能覆盖原本的属性 11/13 15:43
14F：推 batis: 谢谢 我在研究看看 11/13 23:30
15F：→ Federer5566: MOD上的KKTV，直接就可以双字幕和调大小 11/14 13:58
16F：推 narihira2000: 感谢分享~ 6F想单独调整一种语言的字幕大小的话可以 11/14 15:46
17F：→ narihira2000: 像原po脚本的bottom那区一样把一种语言的字幕css额 11/14 15:46
18F：→ narihira2000: 外拆出来而非逗号分隔 就可以额外单独定义罗 11/14 15:46
19F：推 batis: 谢谢narihira大分享 原po稍早有站内信另一个方便调整的样式 11/14 15:50
20F：→ batis: 试用後觉得很棒 看他後续会不会再贴上来更新分享 11/14 15:51
※ 编辑: zonppp (218.161.25.71 台湾), 11/14/2025 19:46:17
21F：推 hoho8: 推推 帮助很大 11/14 20:21