Youtube Subtitle Caption Stylish

This is to replace the subtitle / caption style using in Youtube

目前为 2022-12-24 提交的版本。查看 最新版本

/* ==UserStyle==
@name             Youtube Subtitle Caption Stylish
@name:en          Youtube Subtitle Caption Stylish
@name:ja          Youtube Subtitle Caption Stylish
@name:zh-TW       Youtube Subtitle Caption Stylish
@namespace   http://userstyles.org
@version     1.6.3
@author      CY Fung
@match       https://www.youtube.com/*
@exclude     https://www.youtube.com/live_chat*
@description       This is to replace the subtitle / caption style using in Youtube
@description:en    This is to replace the subtitle / caption style using in Youtube
@description:ja    Youtubeで使用している 字幕(キャプション)のスタイル を置き換えるためのものです。
@description:zh-TW 這是為了替換 Youtube 中使用的字幕樣式
@license     MIT
@run-at        document-start
==/UserStyle== */

@-moz-document url-prefix("https://www.youtube.com") {



  ytd-watch-flexy .ytp-caption-segment{
      --font-size: 18px;
  }
  
  ytd-watch-flexy[theater] .ytp-caption-segment{
      --font-size: 2vw;
  }
  
  ytd-watch-flexy[fullscreen] .ytp-big-mode .ytp-caption-segment{
      --font-size: 2.6vw;
  }
  
  
  
  #ytp-caption-window-container .caption-window.ytp-caption-window-bottom[style*="text-align:"][style*="center"][style*="bottom:"][style*="margin-left:"][style*="left:"]{
      width:auto !important;
      width:100% !important;
      left:0 !important;
      margin-left:0 !important;
      padding-bottom:0 !important;
      margin-bottom:0 !important;
      bottom:calc(40px + 2%) !important;
      touch-action: none !important; 
      pointer-events:none !important;
      cursor:default !important;
  }
  
  #ytp-caption-window-container .caption-window.ytp-caption-window-bottom[style*="text-align:"][style*="center"][style*="bottom:"][style*="margin-left:"][style*="left:"] .captions-text .caption-visual-line .ytp-caption-segment{
  
      
      --scale: 2.15;
      --base-font-size:13.6233px;  
      
      --text-color:rgba(221, 221, 221, 0.863);
      --text-color:rgba(244, 244, 244, 1);
      
      
      --text-shadow-h-shadow: 0px;
      --text-shadow-v-shadow: 0px;
      --text-shadow-blur-radius: 1.7px;
      --text-shadow-color:rgb(0, 120, 255);
      --text-outline-color:rgb(0, 120, 255);
      
      --text-shadow: var(--text-shadow-color) var(--text-shadow-h-shadow) var(--text-shadow-v-shadow) var(--text-shadow-blur-radius);
      
      --text-font: "Noto Sans TC", "Noto Sans SC", "Noto Sans JP", "Noto Sans KR", "YouTube Noto", Roboto, "Arial Unicode Ms", Arial, Helvetica, Verdana, "PT Sans Caption", sans-serif;
      --font-weight:400;
      --letter-spacing: 0px;
      
      
      --text-shadow-black-outline: rgb(0, 120, 255);
      
      margin:2px 0 !important;
      display: inline-block !important;
      white-space: nowrap !important;
      background: transparent !important;
      
      font-size: var(--font-size) !important; 
      transform:none !important;
      
      text-shadow:
                                              var( --text-outline-color) -1px -1px 0,
                                              var( --text-outline-color) -1px 1px 0,
                                              var( --text-outline-color) 1px -1px 0,
                                              var( --text-outline-color) 1px 1px 0,
                                              var(  --text-shadow-color) 0 0 1.5px,
                                              var(  --text-shadow-color) 0 0 2px,
                                              var(  --text-shadow-color) 0 0 2.5px,
                                              var(  --text-shadow-color) 0 0 3px,
                                              var(  --text-shadow-color) 0 0 3.5px,
                                              var(  --text-shadow-color) 0 0 4px,
                                              var( --text-shadow-black-outline) -2px -2px 2px,
                                              var( --text-shadow-black-outline) 2px 2px 2px,
                                              var( --text-shadow-black-outline) 2px -2px 2px,
                                              var( --text-shadow-black-outline) -2px 2px 2px
                                              !important; 
      
      
      color: var(--text-color) !important;
      fill: var(--text-color)  !important;
      font-family: var(--text-font) !important;
      font-weight: var(--font-weight) !important;
      letter-spacing: var(--letter-spacing) !important; 
      touch-action: none !important; 
      pointer-events:none !important;
      cursor:default !important;
  }


}

QingJ © 2025

镜像随时可能失效,请加Q群300939539或关注我们的公众号极客氢云获取最新地址