제뉴어리의 모든것

perspective 속성은 원금감을 주는 속성으로 값은 0보다 커야하며, 원래 있던 위치에서 사용자가 있는쪽으로 얼마나 이동하는지를 픽셀 크기로 나타낸다. 값이 클수록 사용자로부터 멀어지고, 주의할 점은 perspective 속성을 변형하는 요소가 아니라 변형하는 요소의 부모 요소에 정의해야 한다는 것이다. /* 박스영역 적용하고 회전 적용 */

X > Y div#container > ul { border: 1px solid black; } 일반 X Y와 X > Y의 차이점은 후자가 직계 자식만을 선택한다는 것입니다. 가령, 아래 마크업을 생각해 보세요. List Item Child List Item List Item List Item #container > ul 선택자는 id가 container인 div의 직계 자손인 ul만 대상으로 삼습니다. 예를 들어 첫 번째 li의 자식인 ul은 대상이 되지 않습니다.

CSS 여러가지 선택자 지금까지 포스팅한 선택자 말고도 간간히 사용되는 선택자가 있어서 이것도 한번 정리를 하는게 좋을 듯해서 이번 포스팅에선 나머지 선택자를 알아보겠습니다. CSS를 처음하시는 분들도 가볍게 보시면 됩니다. 저도 잘 외우는 스타일이 아니라서 이렇게 정리를 한번씩 해봅니다. 나중에 기억이 안나면 보면서 하면 되니까 말입니다. 1. A + B 이것은 무슨 연산자 같은 선택자입니다. 이것은 a 태그 옆에 B태그를 선택하라는 선택자입니다. 안녕하세요 하이요 룰루랄라 위의 그림을 보면 이해가 갈란가요? 앞에 포스팅 보면 자손,후손에 관한 선택자가 있었는데요. 이것은 자매 관계에 있는 태그 중에 바로 옆에 있는 태그를 선택하라는 선택자입니다. 가운데 h1태그는 div태그 아래에 있기 때문에 적용이..

- 선택자종류 1. 태그 선택자 기존 HTML에 존재하는 태그에 대하여 CSS 효과를 적용 2. 클래스 선택자 주 목적이 여러 곳에서 공통된 효과를 주려고 사용하는 선택자 EX:) 3. 아이디 선택자 해당 페이지내에 유일한 태그에 대하여 적용하기 위한 선택자. 클래스 선택자처럼 중복으로 여러곳에 사용해도 적용은 되지만, 만들어진 의도와 맞지 않으므로 유일하게 사용할것. 4. 가상 클래스 선택자 선택자 뒤에 :가상이벤트를 붙이면 특정 이벤트마다 적용 할 스타일을 설정 할 수 있으며, 이를 가상 (추상)클래스라 함. :link - 방문한 적이 없는 링크 :visited - 방문한 적이 있는 링크 :hover - 마우스를 롤오버 했을 때 :active - 마우스를 클릭했을 때 :focus - 포커스 되었을 때..

KKOTKKIO kkotkkio@gmail.com 안녕하세요~ 2016.09.29 17:54 kkotkkio@gmail.com 안녕하세요~ 2016.09.29 17:54 출처: https://kkotkkio.tistory.com/79 [KKOTKKIO'S CAVE] * { margin: 0; padding: 0; } body { font-size: 11px; } .chat_list_wrap { list-style: none; } .chat_list_wrap .header { font-size: 14px; padding: 15px 0; background: #F18C7E; color: white; text-align: center; font-family: "Josefin Sans", sans-serif; ..

dororongju.tistory.com/151