Question

我的html文件中有以下代码：

  <video 
     src="finalvid.mp4"
     preload="auto"
     width="320"             
     heigth="240"
     align="right"             
     controls
     loop>
  </video>

首先，我试图在右边对齐它。显然，align =＆＃34; right＆＃34;部分不起作用（可能它并不属于那里）。我正在搜索要放入css文件的视频标签，但我找不到任何东西。其次，我想在视频的左侧放置一个段落。 http://prntscr.com/htsarp（忽略无意义的文本，它只是一个示例:)）。基本上，要有2列，第一个（左）是文本，第二个（右）是视频。

Answer 1

将每一面包裹在一个块元素中（例如div，section等），然后用一个＆＃34; flex容器包裹它们＆＃34;这是display:flex的元素。默认情况下，Flex容器会将其子项放在一行中。

演示

＆＃13;

html,
body {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  border: 0
}

.main {
  display: flex;
  justify-content: center;
  align-items: center;
}

.section {
  width: 50%;
  height: 100%;
}

video {
  width: 100%;
  height: 56.25%;
  margin-top: 21.875%;
}

＆＃13;

<main class='main'>

  <section class='left section'>

    <p>But I must explain to you how all this mistaken idea of denouncing pleasure and praising pain was born and I will give you a complete account of the system, and expound the actual teachings of the gre</p>

  </section>
  <section class='right section'>

    <video src='http://media6000.dropshots.com/photos/1381926/20170326/005611.mp4' controls></video>

  </section>

</main>

＆＃13;

HTML：如何在右侧对齐我的视频并在左侧放置文字？

1 个答案:

演示