Contenido

Estilo de subtítulos

Da estilo a los subtítulos traducidos con plantillas o con tu propio CSS, por ejemplo para desenfocar la traducción hasta pasar el cursor.

Abre Subtítulos de video → Estilo de subtítulos en los ajustes. La vista previa se actualiza mientras cambias cosas.

Ajustes básicos

  • Modo de visualización: bilingüe, solo original o solo traducción.
  • Posición de la traducción: encima o debajo del original.
  • Subtítulo principal y Subtítulo de traducción: fuente, escala, color y grosor de cada línea.
  • Opacidad del fondo: lo oscuro que es el recuadro detrás de los subtítulos.

Restablecer a predeterminado lo devuelve todo a su estado inicial.

Plantillas predefinidas

En CSS personalizado → Plantilla predefinida:

Plantilla Qué hace
Difuminar traducción Desenfoca la traducción hasta que pasas el cursor, para que escuches primero
Traducción subrayada a trazos Subraya la traducción con una línea discontinua
Atenuar original Hace más tenue la línea original para que destaque la traducción

Tu propio CSS

El CSS que escribes se aplica encima de los ajustes anteriores. Estos son los selectores que puedes usar:

Selector Qué es
.read-frog-subtitles-box El recuadro que contiene ambas líneas
.subtitles-main La línea original
.subtitles-translation La línea traducida

Desenfocar la traducción y mostrarla al pasar el cursor:

.subtitles-translation {
  filter: blur(6px);
}

.subtitles-translation:hover {
  filter: none;
}

Una traducción amarilla con sombra en lugar de recuadro:

.read-frog-subtitles-box {
  background: transparent;
}

.subtitles-translation {
  color: #ffd84d;
  text-shadow: 0 1px 3px rgb(0 0 0 / 0.9);
}

El editor revisa tu CSS mientras escribes; haz clic en Guardar para aplicarlo.