如何使跨度和输入彼此相邻并共同占据包含div的宽度的100%？

要使跨度和输入彼此相邻并共同占据包含div的宽度的100%，可以使用CSS中的Flexbox布局来实现。

首先，将包含div设置为flex容器，可以通过设置其display属性为flex来实现：

.container {
  display: flex;
}

然后，将跨度和输入元素作为flex项放置在容器中。默认情况下，flex项会水平排列，因此它们将共同占据容器的宽度：

<div class="container">
  <span class="span-element">跨度元素</span>
  <input type="text" class="input-element" placeholder="输入元素">
</div>

接下来，可以通过设置flex项的flex属性来控制它们在容器中的宽度比例。例如，如果要使跨度元素占据容器宽度的70%，输入元素占据30%，可以这样设置：

.span-element {
  flex: 7;
}

.input-element {
  flex: 3;
}

这样，跨度元素和输入元素将相邻并共同占据包含div的宽度的100%。

关于腾讯云相关产品，由于要求不能提及具体品牌商，无法给出相关产品和链接地址。但腾讯云提供了丰富的云计算服务，包括云服务器、云数据库、云存储等，可以根据具体需求选择适合的产品。