<div style="background-image:url('https://ac.namu.la/20220107s1/0119bcda7aa1b1e97943622e6339258b3bbb69cf198ed93cff22d5c2e677b5ea.png');padding:10px;background-repeat:no-repeat;background-position:center -6px;border:6px solid #6da7cd;border-radius:6px">

위 코드는 홀로라이브 (https://arca.live/b/holopro/41868468)에서 뜯어온 코드임

url 괄호 안에 이미지 링크 넣으면 해당 이미지가 나오고

'background-repeat:no-repea'는 백그라운드에 넣은 이미지 반복해서 채우는걸 안 하는 코드

'border:6px solid #6da7cd'에서 border는 테두리 선 크기로 기억하고 solid 코드는 색깔 지정하는거

'border-radius:6px'에서 radius 값은 도형 테두리 둥글게 하는 값

padding은 무슨 역할 하는진 모르겠음 살면서 코드 오늘 처음 만져봄

'position:center' center로 하면 이미지가 정중앙에 나옴

이걸로 위치 조절 가능

여기에 코드 고수들 놀러오는 걸로 아는데 그 친구들이 설명 잘해줄듯