# 1-7. 동영상 안에 글씨&CTA 넣는 방법

# 👉🏻 동영상 태그 위치 

> 아래 사진처럼 </> 아래 태그에요

![Image](https://upload.cafenono.com/image/slashpageHome/20240324/010334_jX8dJhvOJLU29C8tlX?q=75&s=1280x180&t=outside&f=webp)

# 👉🏻 동영상,글씨, CTA 수정방법

> 동영상은 업로드했다는 가정하에 작성할게요 
> 1은 마진에 -(minus)를 주어서 여백을 줄였어요 (**배경색이 회색이라 줄이 보이는걸 없애는 코드입니다**)
> 2,3 라인은 동영상 관련내용이에요
> 4,5,6은 이미지 관련된 코드에요 
> 7은 링크 관련된 코드에요 
> 8,9는 CTA을 사용할 사각박스와 박스안에 들어갈 텍스트에요

```javascript
<div style="margin-bottom: -10px">
  <video src="https://sbbb.me/design/lion_mo.mp4" class="media media-video" playsinline="" autoplay="autoplay" muted="muted" 
    loop="true" style="width: 100%; height: 100%; object-fit: cover; position: relative"></video>
  <div style="position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);">
    <div style="display: flex; flex-direction: column; align-items: center;">
      <img src="https://cdn.imweb.me/upload/S202310191624e42e884b9/c9612b403e85e.png" alt="이미지 설명" style="width: 80%;">
	  <a href="/shop">
      <div style="background-color: red; width: 130px; height: 30px; display: flex; justify-content: center; align-items: center; margin-top: 10px;">
        <p style="text-align: center; color: white; padding-top: 10px; font-size: 11px;">SHOP NOW</p>
      </div>
      </a>
    </div>
  </div>
</div>
```

> **코드설명**
> line 2) **동영상** 수정은 **video src="**"부분만 수정해주시면 됩니다 
> line 6) **이미지**(로고) 수정은 **img src=""** 부분만 수정해주시면 됩니다 
> line 7) **링크** 수정은 **a herf=""** 부부만 수정해주시면 됩니다
> line 8) **네모박스색**을 바꾸고 싶으면 **red;** 부분을 #으로 시작되는 RGB코드나, whith, blue 등으로 바꾸셔도 됩니다
> line 8) **네모박스크기**를 키우고 싶으면 **height: 30px** 를 30~50px로 수정하면 적당합니다!
> line 9) 빨간 네모박스에 **글자수정**은 **SHOP NOW** 부분만 수정해주시면 됩니다

For the site tree, see the [root Markdown](https://slashpage.com/amaewo.md).