返回新闻列表

swiper里面如果又视频和图片,css将视频100%铺满,不撑高解决办法

发布日期: 2024-08-20 | 来源: 智软设计工作室


swiper里面如果又视频和图片,由于视频客户比例和图片不对。会导致高度不一样。会导致swiper高度撑高,其他比例少的就会又空白,

由于考虑图片自适应。没有采用背景,背景的话。有些是显示不完全,只能像办法css裁剪掉视频,


里面视频样式用这个即可。

      .swiper-containervd .swiper-slide video {   

     position: absolute; /* 绝对定位视频 */

top: 0;

left: 0;

width: 100%; /* 视频宽度 100% */

height: 100%; /* 视频高度 100% */

object-fit: cover; /* 视频填满容器并裁剪多余部分 */

 }


整理的代码在这里。https://www.002t.cn/jishuwenzhang/130.html 

推荐技术资料

解决苹果IOS、Android 以及各种浏览器 视频不能自动播放问题,data-wf-ignore="true"

2023-06-13

IOS 自动播放视频的简单解决方案,加入:data-wf-ignore="true"data-object-fit="cover"具体代码<videoid="myVideo"autoplay=""muted=""playsinline=""data-wf-ignore="true"data-object-f

阅读更多

html css 解决DPI=125% 网站放大网页图片的问题

2022-11-11

html css 解决DPI=125% 网站放大网页图片的问题但是我们知道这个现象的原因是因为笔记本DPI=125%导致页面整体被放大了,于是我回到浏览器中,使用Ctrl + 鼠标滚轮将网页缩小,缩小到80%的时候,我发现这个效果和UI设计稿居然保持一致了,而且图片的大小也对的上。所以到这一步,我们原因找到了,解决方案也有了,那就是通过

阅读更多

pbootcms 增加清理冗余图片功能可视化,默认没显示,自己活动添加

2022-11-29

清理冗余图片功能可视化,支持图片预览和选择图片手动删除。默认没显示,自己手动添加官方最新版本已经增加,但菜单没加入打开链接/admin.php?p=/menu/index增加菜单(需要选择大类。不能是顶级分类)输入url为下面的/admin/ImageExt/index其他随意,然后重新登录后台即可

阅读更多

windows2016 standard 激活方法

2021-11-11

激活步骤:1.如下图,以管理员运行;2.输入:123slmgr /ipk WC2BQ-8NRM3-FDDYY-2BFGV-KHKQYslmgr /skms kms.03k.orgslmgr /ato

阅读更多

PbootCMSV3.2.5后台增加自定义字段搜索,可搜索标题和其他自定义字段

2024-05-24

我们在后台模型里面新增了自定义字段后,然后想要在后台搜索哪里。能搜索。需要处理下。首先打开。apps/admin/model/content/ContentModel.php主要更改二个函数// 查找指定分类及子类文章 public function findContent($mcode, $scode, $keyword)// 在全部栏目查找文章 public function findCont

阅读更多

小米笔记本字母键盘错乱解决办法-不用Num Lock键的方法

2023-07-06

今天准备做网站写程序,发现键盘打字对不上,也就是字母键盘错乱,打d出来f,网站找了下。都说用fn+Num Lock键,但是小米键盘没有Num Lock键盘。那怎么办了。看网上说是驱动问题,要更新驱动,我也试了一下。发现还是不行。提示已经最新了。然后我干脆把所有的键盘设备驱动,全部删除了。重启一下电脑就好了。记得是删除这些

阅读更多

css字体渐变颜色和背景渐变颜色实现方法

2023-05-09

css字体渐变颜色background-image:-webkit-linear-gradient(bottom,#fb1919,#fd8403,#75751e);-webkit-background-clip:text;-webkit-text-fill-color:transparent;这里要注意。如果设置了这个。css字体移动样式也要设置。不然普通字体移动变色。没有效果,css背景渐变颜色代码如下:background-image: linear-gradient(140d

阅读更多

pbootcms利用扩展标签二次格式化模型字段 -分割多行字段成为faq问答

2023-04-24

分割多行字段成为faq问答,首先先模型字段新增一个多行字段,填写内容如下,问题.答案.@问题1.答案.@@是必备的。因为要拆分二次,一个组一个@然后在,\apps\home\controller/ExtLabelController.php 目录里面添加自定义标签 (扩展标签)添加以下代码/*必备启动函数*/

阅读更多

asp获取ip判断用户属于什么国家

2024-03-14

免费的api不用注册每天最多查询1000次,小流量网站够用,大流量可以自己买套餐OnErrorResumeNextDimipAddress,field'获取客户端真实IP地址IfNotRequest.ServerVariables("HTTP_X_FORWARDED_FOR")=""ThenipAddress&nb

阅读更多