프로그래밍/HTML & CSS

[HTML/CSS]가상 선택자 종류 애니메이션

1. 가상 선택자 1) 선택한 요소가 특별한 상태여야 만족할 수 있다. 2) 구분 - 동적 가상 선택자 - 구조적 가상 선택자 2. 동적 가상 선택자(Dynamic) 1) 어떠한 상태나 조건이 발생할 때, 사용자의 액션에 따라 스타일이 바뀌는 선택자이다. 2) ACTIVE, VISITED, DISABLED, HOVER, FOCUS - ACTIVE : 클릭 시 활성화되는 가상 클래스 - VISITED : 사용자가 이미 방문한 링크를 표시해준다. - DISABLED : 비활성화된 요소를 나타내며 비활성화 시키는 역할을 한다. 단독으로 쓰이기보다는 조건을 추가하여 조건에 해당하지 않는 경우, 폼에 입력할 수 없도록 만드는 용도로 사용이 된다. - HOVER : 마우스 커서를 요소에 올려 놓았을 때 선언한 스타..

2022. 10. 13. 11:25

프로그래밍/HTML & CSS

[HTML & CSS]선택자 종류 문법 배치속성 반응형 플렉스 박스 정렬

1. CSS (Cascading Style Sheets) 적용하기 1) HTML 내부에서 적용하기 CSS 코드 2) 외부 CSS 파일 적용하기 2. CSS 선택자 1) 종류 - 전체 선택자(*) : head를 포함한 HTML 문서 내의 모든 요소를 선택한다. - 유형(type) 선택자 - tag selector - 특정 태그 지정해 작성하는 방식이다. - 아이디 선택자(#) - 요소를 식별해주는 선택자이다. - 특정 아이디 하나를 선택할 때 사용한다. - #아이디 : 아이디를 지정하여 일치하는 요소(태그)를 선택한다. 단, 아이디는 중복 할 수 없다. - 클래스 선택자(.) - 여러 태그를 하나의 클래스로 묶을 수도 있고, 태그 하나에 여러 클래스 이름을 붙여줄 수 있다. - .클래스명 : 클래스명과 일..

2022. 10. 12. 11:30