chrome audio video默认会有圆角会有背景，看起来非常别扭，使用audio video的border和border-radius无法重置audio和video的边框和圆角样式。
吴先成通过反复探索发现想要重置chrome中的audio video为方形为圆角样式，可以通过将audio和audio::-webkit-media-controls-panel的背景设置为相同颜色实现。
示例代码
- <style>
- audio{
- background: #ff8c00;
- }
- audio::-webkit-media-controls-panel{
- background: #ff8c00;
- }
- </style>
- audio::-webkit-media-controls-panel
- audio::-webkit-media-controls-mute-button
- audio::-webkit-media-controls-play-button
- audio::-webkit-media-controls-timeline-container
- audio::-webkit-media-controls-current-time-display
- audio::-webkit-media-controls-time-remaining-display
- audio::-webkit-media-controls-timeline
- audio::-webkit-media-controls-volume-slider-container
- audio::-webkit-media-controls-volume-slider
- audio::-webkit-media-controls-seek-back-button
- audio::-webkit-media-controls-seek-forward-button
- audio::-webkit-media-controls-fullscreen-button
- audio::-webkit-media-controls-rewind-button
- audio::-webkit-media-controls-return-to-realtime-button
- audio::-webkit-media-controls-toggle-closed-captions-button
|
|
