김코드의 웹디자인 세상

안녕하세요! css속성 중 그림자를 주는 속성에 대해서 가지고 왔습니다. css에서 그림자는 주는 속성은 text-shadow와 box-shadow와 drop-shadow가 있는데요 text-shadow는 글자에 그림자를 주는 속성이고 box-shadow와 drop-shadow는 오브젝트에 그림자를 주는 속성입니다. 오늘은 box-shadow와 drop-shadow에 대해서 알아보며, 둘 속성에 대한 차이점과 용도에 대해서 알아보도록 하겠습니다! 1. box-shadow 박스 쉐도우 먼저 첫 번째로 box-shadow입니다. 이 속성의 용도는 오브젝트에 그림자를 주어 입체감을 주는 속성입니다. 이 속성은 오브젝트를 하나의 박스로 보고 그 박스 영역에 그림자를 주는 속성입니다. box-shadow: 2px..

css의 position에는 4가지의 요소가 있다. (sticy 다른 개념으로 이해되기 때문에 제외) 각각의 4가지 요소에는 속성으로 top, bottom, left, right, z-index를 사용할 수 있고 음수를 사용하여 요소의 각 방향별 거리를 지정할 수 있다! 그러면 이제 각각의 속성에 대해서 알아보겠다. 1. static static 은 기준이 없는 상태이다. 그렇기 때문에 작성했을 때 기본으로 지정되는 기본값으로 생각하면 된다. 그러면 이 배치 요소는 사용하지 않는 걸까? 아니다! 자식 요소가 부모 요소가 아닌 부모의 부모(조상 요소)를 기준으로 잡을 때는 사용하게 된다. 위 그림은 자식 요소 1,2,3과 그리고 부모 요소, 조상 요소가 보인다. 만약 자식 2 가 부모의 조상 요소를 기준으..