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.