See the Pen <a> by nilgi (@nilgi) on CodePen.

• href="URL" : 링크 주소 지정

• target : 링크가 열리는 창을 지정

   _blank - 새창

   _parent - 부모창

   _self - 자신의 창

   _top - 프레임을 무시하고 전체 화면에 열린다.

• 링크 상태

link : 방문한적이 없는 링크 상태

visited : 방문한 적이 있는 링크 상태

hover : 마우스 커서가 링크위에 올라갔을 때 상태

focus : 링크에 포커스가 위치해있는 상태

active : 마우스를 눌렀다가 놓았을 때

See the Pen filter by nilgi (@nilgi) on CodePen.

• grayscale(%) : 흑백화

• blur(px) : 흐림
• brightness(%) : 밝기
• contrast(%) : 대비
• drop-shadow(x, y, 흐림, 색) : 그림자
• hue-rotate(deg) : 색조
i• nvert(%) : 반전
• opacity(%) : 불투명
• saturate(%) : 채도
• sepia(%) : 세피아

※ 두 가지 이상 효과 조합 가능.

See the Pen 색이 변하는 배경 그라디언트 by nilgi (@nilgi) on CodePen.

 body {
            margin: 0;
            height: 100vh;
            background: linear-gradient(45deg, #f3efb0, #a8dded, #d9dcef, #ede4e5);
            /* 배경 그라디언트 지정 */

            background-size: 200% 200%;
            animation: gradient 5s ease infinite;
           /* 배경색 변하는 애니메이션 지정 5초 */

 }

        @keyframes gradient {
            0% {
                background-position: 0% 50%;
            }
            50% {
                background-position: 100% 50%;
            }
            100% {
                background-position: 0% 50%;
            }
        } /* 5초동안 배경색 바꾸는 코드 */

See the Pen 속성 받기 all by nilgi (@nilgi) on CodePen.

• initial 모든 속성을 문서의 최초값으로 초기화
• inherit 부모 요소의 속성 받기
• unset 부모 속성이 있으면 받고 없으면 초기화

See the Pen linear-gradient를 이용한 배경에 투명도 주기 by nilgi (@nilgi) on CodePen.

블로그 꾸미기 놀이 중이다.

맘에 안 들어서 여태 만들걸 모두 지워버렸다. 굿~