scrollamount 是 <marquee> 的原生 HTML 属性，无法通过 CSS 修改，必须用 JavaScript 设置可写的 scrollAmount DOM 属性；现代推荐方案是用 CSS 动画替代 <marquee>。
scrollamount 是 <marquee> 标签的原生属性，它不能直接用 CSS 修改——CSS 里根本没有这个属性，浏览器也不识别 scrollamount 作为 CSS 声明。
为什么改不了？
因为 scrollamount 是 HTML 元素的专有布尔/数值型属性，由浏览器内置的 <marquee> 渲染引擎解析，不属于 CSS 可控范围。你写 marquee { scrollamount: 2; } 完全无效，DevTools 里也看不到这条样式生效。
想动态调速，只能用 JavaScript 操作 DOM 属性
要改速度，必须通过 JS 直接设置元素的 scrollAmount 属性（注意：JS 中是驼峰命名，不是连字符）：
<marquee id="news-ticker">重要通知：系统将于今晚升级</marquee>
<script>
const ticker = document.getElementById('news-ticker');
ticker.scrollAmount = 4; // 立即生效，等价于 scrollamount="4"
// 也可以响应用户操作
document.querySelector('#speed-up').onclick = () => {
ticker.scrollAmount = Math.min(ticker.scrollAmount + 1, 20);
};
</script>
-
scrollAmount是只读属性？不，它是可写的 DOM 属性，修改后滚动会实时变快/慢 - 值必须是正整数，建议控制在
1–10区间；超过20容易跳帧或文字“瞬移” - 不能用
setAttribute('scrollamount', '5')替代，部分浏览器兼容性差，优先用点号赋值
真正推荐的替代方案：用 CSS 动画重写滚动效果
既然 <marquee> 已被 HTML5 废弃，且 scrollamount 无法 CSS 化，不如彻底放弃它，用现代方式实现可控滚动：
立即学习“前端免费学习笔记（深入）”；
<div class="ticker">
<div class="ticker-content">公告一｜公告二｜公告三｜公告四｜</div>
</div>
<style>
.ticker {
overflow: hidden;
white-space: nowrap;
}
.ticker-content {
display: inline-block;
animation: scroll-left 20s linear infinite;
}
@keyframes scroll-left {
0% { transform: translateX(100%); }
100% { transform: translateX(-100%); }
}
</style>
- 速度由动画时长
20s控制：数值越小，滚动越快；可绑定 JS 动态改animationDuration - 方向由
translateX()正负号决定；垂直滚动换成translateY() - 完美支持响应式：媒体查询中可单独调整不同屏幕下的
animationDuration - 无障碍友好：可加
aria-live，而<marquee>几乎无可访问性支持
别再试图给 scrollamount 加 CSS 类了——它根本不是样式问题，而是技术路径过时。真正需要改的，是你的实现思路本身。
