시간과 공간

브라우저 크기에 맞게 동영상 사이즈 맞추기 CSS 예시 코드 //css .wrapper { position: relative; font-size: 0; } .video-box { width: 100%; } ~~ 비고 동영상은 background로 사용할 수 없어 video 태그로 추가하여 사용한다. video 태그는 스타일 제어 시 단독 사용보다는 부모로 감싸는 태그를 사용하면 사용이 편리하다.

CSS 말 줄임, 특수문자 줄 바꿈 1줄 말줄임 HTML 삽입 미리보기할 수 없는 소스 2줄 이상 말 줄임 -webkit- 엔진에서는 두줄이상 말 줄임이 적용이 안되어 -webkit- 속성을 추가해 준다. HTML 삽입 미리보기할 수 없는 소스 특수문자 줄 바꿈 HTML 삽입 미리보기할 수 없는 소스

CSS 가상선택자 연습하기 연습용 코드 :only-child : 구조적 가상클래스로 어떤 요소의 자식이 하나 밖에 없을 때 적용 합니다. :only-child 일때 coral border The 1 paragraph. The 2 paragraph. The 3 paragraph. The 4 paragraph. The 5 paragraph. The 1 paragraph. The 2 paragraph. The 3 paragraph. The 4 paragraph. The 5 paragraph. The 1 paragraph. The 2 paragraph. The 3 paragraph. The 4 paragraph. The 5 paragraph. The 1 paragraph. 출력

CSS 가상클래스 의미 가상 클래스 선택자(Pseudo-Classes) 가상 클래스는 웹 문서의 소스에는 실제로 존재하지 않지만 필요에 의해 임의로 가상의 선택자를 지정하여 사용하는 것을 말한다. 특징 문서의 특정위치, 특정영역, 특정요소를 선택하지 위하여 미리 만들어 놓은 선택자이다. ':' 기호를 사용하여 요소에 대해 더 정밀한 선택 및 스타일 지정 스타일을 적용하는 대상을 요소명이나 속성명, 속성값에 따라 분류하는 것이 아니라 '상황'에 따라 분류한다. 종류 1) 링크에 대한 가상 선택자(link > hover > visited > active 지정 순서에 주의해야 한다) - a:link : 사용된 적이 없는 링크를 선택했을 때 - a:hover : 링크 위에 마우스가 올라갔을 때 - a:visit..