Edge浏览器播放视频有白边或黑边是怎么回事？

脑看视频在使用全屏的时候，屏幕右侧会出现一条白线。如下图：

经过多次实验判断，出现此现象的原因是：

使用Win10系统下，显示缩放比为系统推荐的125%，并且使用的是Edge浏览器，当开启全屏模式后，就会在屏幕右侧边缘位置出现白线。

此问题属于Edge浏览器自身兼容性的问题，与电脑的屏幕质量没有任何关系。

操作步骤:

解决方法有两个：

1、在显示设置中，将“更改文本、应用和其他项目大小”调节为100%，注销系统并重新登录之后，再使用Edge浏览器全屏模式播放视频。

2、此现象目前发现只存在Edge浏览器上，建议您使用其它浏览器，或者系统自带的IE浏览器。

您需要准确区分Edge浏览器和IE浏览器，这是两个不同的浏览器，图标如下：

也可以查看浏览器右上方是否有3个小黑点，如图：

如果是的话，点击此处会出现下拉提示，选择“使用Internet Explorer打开”；

也可通过开始菜单内的Windows附件找到并打开IE浏览器。

内容来自http://iknow.lenovo.com/detail/dc_174450.html

来看下常用的标签列表，后文会一一介绍：

<!DOCTYPE html>

<head>

</head>

基本标签

使用 HTML5 doctype，不区分大小写。

<!DOCTYPE html>

声明文档使用的字符编码

更加标准的 lang 属性写法 http://zhi.hu/XyIa

简体中文
<html lang="zh-cmn-Hans">
繁体中文
<html lang="zh-cmn-Hant">

很少情况才需要加地区代码，通常是为了强调不同地区汉语使用差异，例如：

菠萝和鳳梨其实是同一种水果。只是大陆和台湾称谓不同，且新加坡、马来西亚一带的称谓也是不同的，称之为黄梨。

优先使用 IE 最新版本和 Chrome

SEO 优化

页面描述

每个网页都应有一个不超过 150 个字符且能准确反映网页内容的描述标签。文档

页面关键词

定义页面标题

定义网页作者

定义网页搜索引擎索引方式，robotterms是一组使用英文逗号「,」分割的值，通常有如下几种取值：none，noindex，nofollow，all，index和follow。文档

可选标签

为移动设备添加 viewport

content 参数：

width viewport 宽度(数值/device-width)
height viewport 高度(数值/device-height)
initial-scale 初始缩放比例
maximum-scale 最大缩放比例
minimum-scale 最小缩放比例
user-scalable 是否允许用户缩放(yes/no)
minimal-ui iOS 7.1 beta 2 中新增属性（注意：iOS8 中已经删除），可以在页面加载时最小化上下状态栏。这是一个布尔值，可以直接这样写：<meta name="viewport" content="width=device-width, initial-scale=1, minimal-ui">

iOS 设备

添加到主屏后的标题（iOS 6 新增）

是否启用 WebApp 全屏模式

设置状态栏的背景颜色

content 参数：

default 默认值。
black 状态栏背景是黑色。
black-translucent 状态栏背景是黑色半透明。

如果设置为 default 或 black ,网页内容从状态栏底部开始。

如果设置为 black-translucent ,网页内容充满整个屏幕，顶部会被状态栏遮挡。

禁止数字识自动别为电话号码

iOS 图标

rel 参数：

apple-touch-icon 图片自动处理成圆角和高光等效果。

apple-touch-icon-precomposed 禁止系统自动添加效果，直接显示设计原图。

iPhone 和 iTouch，默认 57x57 像素，必须有

iPad，72x72 像素，可以没有，但推荐有

Retina iPhone 和 Retina iTouch，114x114 像素，可以没有，但推荐有

Retina iPad，144x144 像素，可以没有，但推荐有

iOS 启动画面

官方文档：https://developer.apple.com/library/ios/qa/qa1686/_index.html

参考文章：http://wxd.ctrip.com/blog/2013/09/ios7-hig-24/

iPad 的启动画面是不包括状态栏区域的。

iPad 竖屏 768 x 1004（标准分辨率）

iPad 竖屏 1536x2008（Retina）

iPad 横屏 1024x748（标准分辨率）

iPad 横屏 2048x1496（Retina）

iPhone 和 iPod touch 的启动画面是包含状态栏区域的。

iPhone/iPod Touch 竖屏 320x480 (标准分辨率)

iPhone/iPod Touch 竖屏 640x960 (Retina)

iPhone 5/iPod Touch 5 竖屏 640x1136 (Retina)

添加智能 App 广告条 Smart App Banner（iOS 6+ Safari）文档

Android

Android Lollipop 中的 Chrome 39 增加 theme-color meta 标签，用来控制选项卡颜色。

http://updates.html5rocks.com/2014/11/Support-for-theme-color-in-Chrome-39-for-Android

Windows 8

Windows 8 磁贴颜色

Windows 8 磁贴图标

其他

添加 RSS 订阅

添加 favicon icon

禁止 Chrome 浏览器中自动提示翻译

自谷歌博客

机器之心编译

参与：一鸣、思

裁剪视频不用愁，谷歌 AutoFlip 实现自动剪辑。视频尺寸、精彩内容通通自动化。

因为手机平板等各种终端设备层出不穷，制作人拍个视频还要剪裁成各种尺寸，以便分发到各种渠道。然而，如果要聚焦于核心内容，那么能追踪主体，并剪裁视频长宽尺寸的能力就必不可少了。

近日，谷歌开源了 AutoFlip 工具。这是一个开源的智能视频剪裁框架，其基于谷歌 MediaPipe 框架。

项目地址：https://github.com/google/mediapipe

在使用过程中，只需要将一段视频和目标维度（如截取的长宽比类型）作为输入，AutoFlip 会分析视频内容并提出一个优化路径和裁剪策略，最后输出一段视频。如下动图所示，我们可以选择各种剪裁长宽比与剪裁模式：

AutoFlip 是什么

AutoFlip 为智能视频调整提供了一套全自动的解决方案，它借助当前顶尖的目标检测与追踪模型理解视频内容。AutoFlip 会检测表示场景变化的构图变化，以便分离出场景进行进一步的处理。在每一个镜头中，它会使用视频分析识别重构场景之前的重要内容，其重构场景主要通过选择针对内容优化的相机模式和路径。

视频裁剪三步走，检测镜头级的视频边界、分析视频内容然后再根据需求进行剪裁。

镜头检测

视频可被视为是一段没有中断的镜头或场景序列。为了检测是否发生了镜头的变化，AutoFlip 计算每一帧的色彩值，并和前一帧进行对比。如果色值的分布发生了明显变化，则标记镜头的改变。在得出剪辑策略前，AutoFlip 会缓存整个视频，用于对整个场景进行优化。

视频内容分析

为了从视频中找到有趣的剪辑片段，AutoFlip 采用了深度学习目标检测模型。有趣的剪辑片段往往包含人和动物，但是其他元素也可以被识别出来，比如文本和广告 logo，运动中的球和动作的捕捉等。

深度学习模型对运动的人或人脸进行了识别。

剪辑

在每一帧找到了兴趣目标后，AutoFlip 自动选择优化策略——静态的、追拍或追踪的，这些取决于目标在视频中的行为。如下图所示，第一行是 AutoFlip 根据帧级的边界框追踪到的相机路径，第二行是平滑后的相机路径。经过平滑处理后，追踪效果还是比较理想的。

左图目标在画面中移动需要追踪相机路径；右图几乎固定在画面相同的位置，静态相机路径就足够了。

AutoFlip 有一个属性图，可以提供最佳效果或自定义需求的剪辑。如果覆盖所有需要的区域不能实现（如目标在一帧视频中显得太大），AutoFlip 则会自动切换到相对不那么激进的策略上。它会应用「信箱效应：letterbox effect」，在保持原始视频尺寸的同时添加屏幕黑边，让画面更自然。

对于右图要求视频囊括所有人脸，AutoFlip 会自动填充半透明黑边以满足设定的视频长宽比。

因为 AutoFlip 是 MediaPipe 的一部分，所以对于具体怎么使用，读者可查阅介绍文档

文档地址：https://github.com/google/mediapipe/blob/master/mediapipe/docs/autoflip.md

最后，和其它机器学习算法一样，AutoFlip 的性能会随着目标检测等能力的提升而大大加强，尤其是衍生出来的能力，例如采访镜头中的说话人检测或动漫中的动物脸检测等等。

当然，目前 AutoFlip 还有挺多提升的地方，尤其是当视频边缘有比较重要的文本信息等。谷歌后续也希望 AutoFlip 能进一步融合自然语言处理等技术实现更合理的视频智能剪裁。

原文地址：https://ai.googleblog.com/2020/02/autoflip-open-source-framework-for.html

在线咨询

上一篇：webpack（四）-css的加载
下一篇：模板分享︱1分钟教你发一条高互动的朋友圈

您的项目需求

*请认真填写需求信息，我们会在24小时内与您取得联系。

整合营销服务商

Edge浏览器播放视频有白边或黑边是怎么回事？

您的项目需求