CSS等比例容器生成器介绍
CSS等比例容器生成器用于快速创建固定宽高比的容器布局，适合图片占位、视频封面、卡片预览等场景。通过可视化参数控制比例与背景色，您可以实时预览效果，并直接获取对应的CSS与HTML代码。
主要参数说明
- Ratio Width (比例宽)：设置宽高比的宽度基准值，数值越大，容器横向越宽。
- Ratio Height (比例高)：设置宽高比的高度基准值，数值越大，容器纵向越高。
- Background (背景色)：设置等比例容器的背景颜色，用于区分内容区域。
使用教程
- 设置比例：在左侧输入 Ratio Width 和 Ratio Height，例如 16:9、4:3、1:1 等常见比例。
- 调整外观：通过背景色选择器设置容器颜色，预览区域会即时同步显示。
- 获取代码：切换到 CSS 和 HTML 标签页复制生成代码，直接用于页面布局。
- 集成应用：将 HTML 结构放入页面，将 CSS 加入样式表，即可得到稳定的等比例容器。
应用场景
- 视频或封面占位：保持比例一致，避免布局跳动。
- 图片网格：统一卡片高度，提升视觉整齐度。
- 响应式组件：在不同屏幕宽度下保持固定比例。
