在非100%宽度的包装器上使用youtube-video作为背景

，可以通过以下步骤实现：

首先，确保你已经有一个YouTube视频的URL链接，该视频将作为背景。
在HTML文件中，创建一个包装器元素，用于容纳视频背景。可以使用div元素，并为其设置一个特定的ID或类名，以便在CSS中进行样式设置。

<div id="video-wrapper"></div>

在CSS文件中，为包装器元素设置宽度和高度，并将其定位为相对或绝对定位，以确保它在页面中正确显示。

#video-wrapper {
  width: 800px; /* 设置包装器的宽度 */
  height: 450px; /* 设置包装器的高度 */
  position: relative; /* 设置包装器的定位方式 */
}

使用JavaScript或jQuery，将YouTube视频嵌入到包装器元素中。可以使用YouTube的嵌入代码，将视频作为iframe嵌入到包装器中。

// 使用JavaScript
var videoWrapper = document.getElementById("video-wrapper");
videoWrapper.innerHTML = '<iframe width="100%" height="100%" src="https://www.youtube.com/embed/VIDEO_ID?autoplay=1&controls=0&showinfo=0&autohide=1&loop=1&mute=1" frameborder="0" allowfullscreen></iframe>';

// 使用jQuery
$("#video-wrapper").html('<iframe width="100%" height="100%" src="https://www.youtube.com/embed/VIDEO_ID?autoplay=1&controls=0&showinfo=0&autohide=1&loop=1&mute=1" frameborder="0" allowfullscreen></iframe>');

请注意，上述代码中的VIDEO_ID应替换为你想要作为背景的YouTube视频的实际视频ID。

根据需要，可以使用CSS对视频进行进一步的样式设置，例如调整包装器的位置、添加遮罩效果等。

#video-wrapper {
  /* 其他样式设置 */
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1; /* 将包装器放置在其他内容的后面 */
}

/* 添加遮罩效果 */
#video-wrapper::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5); /* 设置遮罩的颜色和透明度 */
}

这样，你就可以在非100%宽度的包装器上使用YouTube视频作为背景了。请注意，这只是一种实现方法，具体的实现方式可能会因项目需求和技术栈而有所不同。