Kaynağa Gözat

feat: 播放器

NeeDaye 6 ay önce
ebeveyn
işleme
abdb9b0bd9
1 değiştirilmiş dosya ile 18 ekleme ve 3 silme
  1. 18 3
      src/pages/Play/index.tsx

+ 18 - 3
src/pages/Play/index.tsx

@@ -34,9 +34,24 @@ const TableList: React.FC<unknown> = () => {
         </div>
       </Card>
       <Card style={{ marginInline: 20, marginTop: 10 }}>
-        <video width="320" height="240" controls autoPlay>
-          <source src="http://player.alicdn.com/video/aliyunmedia.mp4" type="video/ogg" />
-        </video>
+        <div style={{ display: 'flex' }}>
+          <div>左侧切换播放模式</div>
+          <div style={{ flex: 1, display: 'flex', flexDirection: 'column' }}>
+            <div>
+              <video width="1150" height="475" autoPlay>
+                <source src="http://player.alicdn.com/video/aliyunmedia.mp4" type="video/ogg" />
+              </video>
+            </div>
+            <div style={{ display: 'flex', justifyContent:'center', gap: 25 }}>
+              <video width="565" height="375" autoPlay>
+                <source src="http://player.alicdn.com/video/aliyunmedia.mp4" type="video/ogg" />
+              </video>
+              <video width="565" height="375" autoPlay>
+                <source src="http://player.alicdn.com/video/aliyunmedia.mp4" type="video/ogg" />
+              </video>
+            </div>
+          </div>
+        </div>
       </Card>
     </PageContainer>
   )