一个div 宽度100% 高度10%,其中包含三个子div横向排列, 一个居中,两个靠右,

可以使用Flex布局来实现这个要求。首先，父级div需要设置为宽度100%和高度10%。然后，使用display: flex;来启用Flex布局。接下来，使用justify-content属性来将子div横向排列，并使用align-items属性来垂直居中子div。

HTML代码如下：

<div class="parent">
  <div class="center"></div>
  <div class="right"></div>
  <div class="right"></div>
</div>

CSS代码如下：

.parent {
  width: 100%;
  height: 10%;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.center {
  width: 30%;
  height: 100%;
  background-color: red;
}

.right {
  width: 30%;
  height: 100%;
  background-color: blue;
}

在上面的代码中，父级div使用了display: flex;来启用Flex布局，并且使用justify-content: space-between;来横向排列子div，并在它们之间留有空间。子div的宽度设置为30%（可以根据需要进行调整），其中一个子div使用了background-color: red;来设置背景颜色，另外两个子div使用了background-color: blue;来设置背景颜色。这样就实现了一个宽度100%、高度10%的父级div，其中包含三个子div横向排列，一个居中，两个靠右的效果。