移動H5中，一般是高度百分百或者寬度百分百，上下左右會有黑邊，但是有些客戶不能接受視頻存在黑邊，面對這種需求，作者采用的是：

??因大部分視頻是9:16，所以以9/16為例。
??判斷設(shè)備屏幕是否大于9/16，大于的設(shè)備，屏幕比例接近3/4，此時用高度百分百來適配，左右會留有黑邊；而小于的設(shè)備，例如蘋果X，此時用寬度百分百來適配，上下會有黑邊。
??那能不能反過來，大于比例的設(shè)備，用寬度百分百來適配，裁剪視頻的上下部分，計算偏移量，通過偏移量來進(jìn)行居中；同理，小于比例的設(shè)備，用高度百分百來適配，裁剪視頻的左右部分。（此方式需要與制作視頻的伙伴提前溝通，把重要信息放在沒有被裁剪的安全范圍內(nèi)）

代碼實(shí)例：
html：

<div id="videoView">
    <video id="video" webkit-playsinline="true" x-webkit-airplay="true" playsinline="true" x5-video-player-type="h5" x5-video-player-fullscreen="true"></video>
</div>

css：

#videoView {
    width: 100%;
    height: 100%;
    display: block;
    overflow: hidden;
}

#videoView video {
    position: absolute;
}

js：

var videoWidth = 1080; // 視頻實(shí)際寬度
var videoHeight = 1920; // 視頻實(shí)際高度
if ((clientWidth / clientHeight) < (9 / 16)) { // 大于比例的設(shè)備
    // 播放器采用高度百分百來適配
    player.style.height = "100%";
    // 計算視頻高度變?yōu)樵O(shè)備屏幕高度后的視頻寬度
    var scaleWidth = videoWidth * clientHeight / videoHeight;
    // 通過縮放后的視頻寬度減去設(shè)備寬度再除以2，計算出居中的偏移量
    var moveLength = (scaleWidth - clientWidth) / (-2);
    //  設(shè)置播放器往左偏移
    player.style.left = moveLength + "px";
} else {
    // 播放器采用寬度百分百來適配
    player.style.width = "100%";
    // 計算視頻寬度變?yōu)樵O(shè)備屏幕寬度后的視頻高度
    var scaleHeight = videoHeight * clientWidth / videoWidth;
    // 通過縮放后的視頻高度減去設(shè)備高度再除以2，計算出居中的偏移量
    var moveLength = (scaleHeight - clientHeight) / (-2);
    //  設(shè)置播放器往上偏移
    player.style.top = moveLength + "px";
}

具體偏移還需要看視頻內(nèi)容，感覺上應(yīng)該有更好的實(shí)現(xiàn)方式。小蝦米一枚，有更好的實(shí)現(xiàn)方式歡迎留言，共勉【抱拳】。