前端技术文章
-
progress元素color不生效因其是替换元素，视觉由浏览器UA样式控制；必须用accent-color（Chrome93+/Firefox97+/Safari15.4+）或伪元素（如::-webkit-progress-value、::progress-value）定制样式。449 收藏 -
audio标签需加controls才显示控件，仅src属性会导致静默加载；必须用<source>提供mp3+ogg双格式并声明type；autoplay须配合muted才生效；原生控件不可CSS定制，需JS自定义。450 收藏 -
HTML页面向服务器上报数据有五种方式：一、表单提交；二、XMLHttpRequest；三、FetchAPI；四、Image对象GET上报；五、WebSocket持续上报。418 收藏 -
Ruby注音必须严格使用rb+rt结构，单独ruby或rt无效；rp用于降级兼容；需CSS控制字号行高；自动化生成须逐字处理并人工校验多音字。268 收藏 -
list-style-position:outside是对齐混乱的根源，因序号绘制在内容框外且不参与盒模型计算，导致序号与文字左边缘错位；应设为inside并统一重置ul/ol的margin和padding，配合box-sizing:border-box与明确line-height确保稳定对齐。213 收藏 -
HTTPS页面加载HTTP资源会被现代浏览器默认阻止，主动混合内容（如script、iframe）直接报错阻断，被动内容（如img）在Chrome94+也统一阻止；应将所有http://替换为https://，并检查API、第三方SDK及构建流程。446 收藏 -
水波纹动画不必强制使用::after或::before，但伪元素最稳妥；需父容器relative定位、content:""、translate(-50%,-50%)居中，JS计算点击相对坐标，搭配cubic-bezier缓动与animation-fill-mode:forwards。274 收藏