반응형
[html,css] 원 만들고 위에 글자, 이미지 넣는 방법
FrontEnd2022. 7. 6. 20:47[html,css] 원 만들고 위에 글자, 이미지 넣는 방법

위 사진처럼 html과 css를 이용해 원을 만들고 글자,이미지를 원 위에 배치하고 싶으신가요..? 저도 처음 웹페이지를 제작 하며 자초지종 다 겪어가며 성공했는데요 ㅠㅠㅠ 정답이 아닐 수도 있습니다만 html과 css로 제가 완성시킨 방법을 알려드릴게요 1) 원 만들기 첫번째로 우리는 원을 만들어 줘야 합니다. HTML에서 태그를 만들어주세요 그 다음으로는 css에서 꾸며주면 돼요 이 때 중요한것은 position !! 꼭 relative 여야 해요 div{ background-color: antiquewhite; border-radius: 50%; width: 24%; padding-bottom: 24%; position: relative; } 자세히 설명 드리자면 해당 css에서 -윗 부분 코드는 ..

반응형
image