优化字幕显示效果

service/video/caption_service.go

@@ -388,15 +388,22 @@ func (s *captionService) buildHTML(taskID, videoPath, audioPath string, elements
 				elemID, animClass, elem.StartTime, elemDuration, trackIdx, html.EscapeString(elem.ImageURL), imgStyle))
 		} else {
 			bgStyle := ""
+			hasBg := false
 			if elem.BgColor != "" {
+				hasBg = true
 				if elem.BgOpacity > 0 && elem.BgOpacity < 1 {
 					bgStyle = fmt.Sprintf("background:%s;padding:12px 24px;border-radius:8px;", hexToRGBA(elem.BgColor, elem.BgOpacity))
 				} else {
 					bgStyle = fmt.Sprintf("background:%s;padding:12px 24px;border-radius:8px;", elem.BgColor)
 				}
 			}
-			sb.WriteString(fmt.Sprintf("  <div id=\"%s\" class=\"clip text-element %s\" data-start=\"%.3f\" data-duration=\"%.3f\" data-track-index=\"%d\" style=\"%s%s\">%s</div>\n",
-				elemID, animClass, elem.StartTime, elemDuration, trackIdx, style, bgStyle, html.EscapeString(elem.Text)))
+			if hasBg {
+				sb.WriteString(fmt.Sprintf("  <div id=\"%s\" class=\"clip text-element %s\" data-start=\"%.3f\" data-duration=\"%.3f\" data-track-index=\"%d\" style=\"%s\"><span style=\"%s\">%s</span></div>\n",
+					elemID, animClass, elem.StartTime, elemDuration, trackIdx, style, bgStyle, html.EscapeString(elem.Text)))
+			} else {
+				sb.WriteString(fmt.Sprintf("  <div id=\"%s\" class=\"clip text-element %s\" data-start=\"%.3f\" data-duration=\"%.3f\" data-track-index=\"%d\" style=\"%s\">%s</div>\n",
+					elemID, animClass, elem.StartTime, elemDuration, trackIdx, style, html.EscapeString(elem.Text)))
+			}
 		}
 		clipIndex++
 	}
@@ -485,6 +492,7 @@ func (s *captionService) buildElemStyle(elem dto.CaptionElement, canvasWidth, ca
 			maxWidthPct = 90
 		}
 		maxWidth := int(float64(canvasWidth) * float64(maxWidthPct) / 100.0)
+		parts = append(parts, fmt.Sprintf("width:%dpx;", maxWidth))
 		parts = append(parts, fmt.Sprintf("max-width:%dpx;", maxWidth))
 
 		if elem.FontSize > 0 {