CSS

[CSS] transfrom 이용하기

transfrom 이용하기 transfrom이란? transfrom의 translate (상하좌우 이동) transfrom의 scale (크기 조절) transfrom의 rotate (회전) transfrom의 skew (왜곡) transfrom이란? transfrom은 특정 요소를 움직이고 싶거나 회전을 시키고 싶거나 크기를 조절 혹은 왜곡하게 해 줍니다. 사용방법은 아래에 translate, scale, rotate, skew순으로 설명과 예시를 보이겠습니다. transfrom의 translate (상하좌우 이동) 위의 예시처럼 요소를 위, 아래, 왼쪽, 오른쪽으로 이동시키고 싶은 경우에 transfrom의 함수인 translate(), translateX(), translateY()를 이용하여 이동..

[CSS] background 이미지 넣기

background 이미지 넣기 background-image란? background-image의 이미지 크기 정하기 background-image의 이미지 반복 처리 background-image란? background에 색상 대신 이미지를 넣고 싶은 경우 background-image를 이용하여 이미지를 넣을 수 있습니다. 이미지를 넣는 방법은 style의 값으로 background-image : url(이미지의 주소)를 주면 됩니다. See the Pen Untitled by rainbowbear (@rainbow96bear) on CodePen. background-image의 이미지 크기 정하기 background-image의 크기를 조절하기 위해서 div의 사이즈를 조절하면 이미지를 띄울 공간..

[CSS] background 색상 넣기 (그라데이션)

CSS의 background 색상 넣기 - 그라데이션 background-color 사용하기 background 그라데이션 효과 그라데이션 반복하기 background-color 사용하기 HTML에서 지정한 영역 예시를 든다면 div태그로 지정된 영역에 배경을 설정할 때 background-color를 이용하여 색을 지정할 수 있습니다. style의 값으로 background-color: blue처럼 지정된 색은 직접 색의 이름으로 입력하여도 되고 RGB 값을 16진수로 표현하여 #FFFFFF처럼 줄 수도 있습니다. See the Pen Untitled by rainbowbear (@rainbow96bear) on CodePen. background 그라데이션 효과 선형 그라데이션 배경에 그라데이션 효과..

[HTML] HTML의 태그란 무엇인가? (태그의 종류)

HTML의 태그란? 태그란 무엇인가? HTML의 필수 태그 태그의 종류와 기능 태그란 무엇인가? HTML은 Hyper Text Markup Language로 하이퍼링크를 통하여 문서에서 다른 문서로 접근할 수 있는 Markup Language입니다. Markup 할 때 사용되는 약속된 표기 법을 tag라고 하며 사이에 태그의 이름을 작성합니다. 어떠한 내용을 태그로 감싼다면 컴퓨터에게 '이 내용은 제목이다.'라고 태그를 달아 알려준다는 의미로 생각하면 됩니다. HTML의 필수 태그 HTML은 기본적인 틀이 있습니다. 이 틀에서 사용되는 태그는 꼭 작성되어야 하는 필수 태그입니다. 필수 태그의 종류는 , //실제로 웹 브라우저화면에 나타날 내용들이 이 부분에 온다는 태그 필수로 들어가는 태그와 웹페이지의 ..