Hugging Face's logo

Spaces:
aiqtech
/
tetete
Running

App Files Community
tetete
File size: 1,810 Bytes 
ff8de4a
 
 
3cb9f76
 
ff8de4a
c868774
ee74111
 
3cb9f76
c868774
3cb9f76
ff8de4a
 
3cb9f76
 
 
 
 
 
c868774
3cb9f76
ff8de4a
 
ee74111
c868774
ee74111
c868774
ee74111
c868774
 
3cb9f76
ff8de4a
 
 
 
 
3cb9f76
ee74111
 
 
 
c868774
3cb9f76
ee74111
 
 
 
3cb9f76
 
ee74111
 
 
 
3cb9f76
 
ee74111
 
 
 
3cb9f76
 
ee74111
 
 
 
ff8de4a
 
 
588660f
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
 
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
  html, body {
    margin:0; padding:0;
    width:100vw; height:100vh;
    overflow:hidden; /* ν•„μš”μ‹œ 슀크둀 제거 */
  }

  .grid-container {
    display: grid;
    width: 100%;
    height: 100%;
    /* 4μ—΄: 이미지(1fr), μ˜μƒ(2fr), 이미지(1fr), μ˜μƒ(2fr) -> 총합 6fr λΉ„μœ¨ μœ μ§€ */
    grid-template-columns: 1fr 2fr 1fr 2fr; 
    grid-template-rows: repeat(5, 1fr); /* 5ν–‰ */
    gap: 5px;
    box-sizing: border-box;
    padding: 5px;
  }

  img, video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }

  /* video autoplay, loop, muted 속성 HTML νƒœκ·Έμ—μ„œ μ„€μ • */
</style>
</head>
<body>

<div class="grid-container">
  <!-- 1ν–‰: 1번, 2번 쌍 -->
  <img src="1.webp" alt="1">
  <video src="1.mp4" autoplay loop muted></video>
  <img src="2.webp" alt="2">
  <video src="2.mp4" autoplay loop muted></video>

  <!-- 2ν–‰: 3번, 4번 쌍 -->
  <img src="3.webp" alt="3">
  <video src="3.mp4" autoplay loop muted></video>
  <img src="4.webp" alt="4">
  <video src="4.mp4" autoplay loop muted></video>

  <!-- 3ν–‰: 5번, 6번 쌍 -->
  <img src="5.webp" alt="5">
  <video src="5.mp4" autoplay loop muted></video>
  <img src="6.webp" alt="6">
  <video src="6.mp4" autoplay loop muted></video>

  <!-- 4ν–‰: 7번, 8번 쌍 -->
  <img src="7.webp" alt="7">
  <video src="7.mp4" autoplay loop muted></video>
  <img src="8.webp" alt="8">
  <video src="8.mp4" autoplay loop muted></video>

  <!-- 5ν–‰: 9번, 10번 쌍 -->
  <img src="9.webp" alt="9">
  <video src="9.mp4" autoplay loop muted></video>
  <img src="10.webp" alt="10">
  <video src="10.mp4" autoplay loop muted></video>
</div>

</body>
</html>