使用css让视频居中
在使用php展示视频时，需要使用css来让视频居中显示。这是一个很简单的过程，只需要使用text-align属性即可。首先，在外层包裹一个div，然后设置其text-align属性的值为center，即可实现视频居中的效果。下面是代码示例：
这里设置了一个宽度为600像素，高度为400像素的视频，使用了controls属性来添加视频控制栏。在div中使用了text-align:center属性，让视频居中显示。实际效果如下：
使用javascript让视频居中
使用javascript也可以实现让视频居中显示的效果。需要使用dom来操作视频元素，然后动态计算其宽度和高度，再计算出它应该定位的位置。下面是实现代码：
var video = document.queryselector('video');
var winw = window.innerwidth;
var winh = window.innerheight;
var vidw = video.offsetwidth;
var vidh = video.offsetheight;
var left = (winw - vidw) / 2;
var top = (winh - vidh) / 2;
video.style.position = 'absolute';
video.style.left = left 'px';
video.style.top = top 'px';这里获取了整个浏览器窗口的宽度和高度，以及视频元素的宽度和高度。然后计算出视频应该定位的左边距和上边距，最后使用style属性来动态设置其位置。实际效果如下：
使用php和css让视频居中
结合使用php和css也可以让视频居中显示。首先使用php来获取视频的宽度和高度，然后使用css让其居中。代码示例如下：
这里使用了getimagesize函数来获取视频的宽度和高度，然后动态设置了video元素的宽度和高度。在包装视频的div上使用了text-align:center属性来使视频居中显示。实际效果如下：
本文来自投稿，不代表亲测学习网立场，如若转载，请注明出处：https://www.qince.net/php-34-2.html
郑重声明：
本站所有内容均由互联网收集整理、网友上传，并且以计算机技术研究交流为目的，仅供大家参考、学习，不存在任何商业目的与商业用途。 若您需要商业运营或用于其他商业活动，请您购买正版授权并合法使用。
我们不承担任何技术及捕鱼10元起上10元下的版权问题，且不对任何资源负法律责任。
如遇到资源无法下载，请点击这里失效报错。失效报错提交后记得查看你的留言信息，24小时之内反馈信息。
如有侵犯您的捕鱼10元起上10元下的版权，请给我们私信，我们会尽快处理，并诚恳的向你道歉！
