html中video作为banner的设置
HTML 设置 作为 Video Banner
2023-06-13 09:13:09 时间
html中video作为banner的设置
效果前:
效果后预览
<video controls class="video"/> 通过css样式可以将其隐藏
//设置全屏平铺
.video{
width: 100%;
height: 100%;
display: block;
object-fit: contain;
}
/* 隐藏video 全屏按钮 */
.video::-webkit-media-controls-fullscreen-button {
display: none;
}
/* 隐藏video 播放按钮 */
.video::-webkit-media-controls-play-button {
display: none;
}
/* 隐藏video 进度条 */
.video::-webkit-media-controls-timeline {
display: none;
}
/* 隐藏video 观看的当前时间 */
.video::-webkit-media-controls-current-time-display{
display: none;
}
/* 隐藏video 剩余时间 */
.video::-webkit-media-controls-time-remaining-display {
display: none;
}
/* 隐藏video 音量按钮 */
.video::-webkit-media-controls-mute-button {
display: none;
}
.video::-webkit-media-controls-toggle-closed-captions-button {
display: none;
}
/* 隐藏video 音量的控制条 */
.video::-webkit-media-controls-volume-slider {
display: none;
}
/* 隐藏video 所有控件 */
.video::-webkit-media-controls-enclosure{
display: none;
}
相关文章
- 用html做简单的日记,学习HTML日记[通俗易懂]
- JS开发引用HTML DOM的location和document对象[通俗易懂]
- 图片中加入超链接html代码,html网页超链接代码 怎样用HTML代码在图片插入超链接…
- HTML添加背景图片_html背景图片铺满网页
- html
- html怎么将表格居中_HTML居中代码
- table如何设置边框4*16_html设置表格边框
- javascript动画效果代码html_javascript代码写在哪里
- html背景图片拉伸解决办法
- html设置网页背景图片大小_html背景图片显示不全
- 怎么修改HTML网页的名字_如何修改html文件内容
- html中三角向下符号,使用css实现三角符号效果[通俗易懂]
- HTML highlight 代码前端高亮、代码美化
- HTML 基础
- 【HTML】HTML 注册表单案例 ① ( 表格设置 | 设置表格位置和大小 | 设置表格标题 | 表单设置 | 表格中设置单选按钮 )
- 【CSS】课程网站头部制作 ① ( 头部区域测量 | 头部盒子标签结构 | 整体页面背景颜色设置 | LOGO 盒子设置 | 切片工具切图 | LOGO 相关 HTML 结构及 CSS 样式编写 )
- html设置文本框的大小
- html通用导航条制作详解编程语言
- Java解压上传zip或rar文件,并解压遍历文件中的html的路径详解编程语言
- HTML的标签详解标签详解编程语言
- Linux上跑起来的HTML之旅(linux运行html)
- 文件MySQL数据库存储HTML文件.(mysql存html)
- HTML <html> 标签
- 用HTML操作MySQL数据库(html调用mysql)
- HTML <b> 标签
- Linux环境实现HTML文件编辑(linux编辑html)
- HTML与Oracle开启精彩的互联网之旅(html和oracle)
- C#中HTML字符转换函数分享
- 给html超链接设置事件不使用href来完成跳
- js通过html()及text()方法获取并设置p标签的显示值
- 在ASP中不用模板生成HTML静态页直接生成.html页面