Order 플렉스 컨테이너에 나타나는 순서를 제어한다. 기본 값은 0 flex-grow / flex-shrink 플렉스 박스 아이템의 기본 너비를 자동으로 늘어나거나 줄어들도록 해서 행 안에 적절한 너비로 배치되도록 맞추는 기능을 한다. grow속성의 기본 값은 0이다. 음수는 허용되지 않는다. flex-shrink 필요한 경우 플렉스 item이 축소되는 기능을 정의 flex-shrink 속성은 플렉스 박스에 flex-wrap: wrap 속성을 부여한 경우 적용되지 않는다. flex-item에 flex-grow를 0으로 지정, 나머지 요소들의 flex-grow를 다르게 주었다. 실습 flex-item에 flex-shrink를 0을 주고 item-4에만 1을 준 경우 item-4만 줄어들어서 해당 행에 맞..

CSS를 사용하는 방법? HTML 안에서 Style 속성을 이용하는 방법 (인라인 스타일) 태그를 통해 HTML 문서 내부에서 이용하는 방법 (내부 스타일 시트) 별도로 CSS 파일을 분리하여 HTML의 문서에 연결하는 방법 (외부 스타일 시트) 인라인 스타일, 내부 스타일, 외부 스타일 적용이 혼합되어 사용될 경우 어떤 스타일을 적용하나? 인라인 스타일 -> 내부 스타일 시트, 외부 스타일 시트 -> 웹 브라우저 기본 스타일 순서로 우선적용 CSS의 기본 구조 선택자, 프로퍼티, 값 내부 스타일 시트 방식으로 css를 적용 외부 스타일 시트 방식으로 css를 적용 .a-button:hover a-button 요소에 마우스를 가져갔을 때만 적용되는 스타일 .a-button:active a-button 요..

태그 (tag) 웹 문서를 구성하는 명령어 꺽새 안에 들어있는 정보를 정의하는 형식 요소의 일부로 시작 태그와 종료 태그 두 종류 종료 태그가 없는 과 같은 태그가 있음(내부에 내용이 필요없음) 요소 (element) 빈 요소 , 내용 없이 구조적인 기능만 하는 요소 블록 요소 h1~h6, div, list, p, ··· 다른 요소를 포함할 수 있는 요소 인라인 요소를 포함할 수 있다. 블록 요소 이후 블록 요소를 사용하면 내용이 세로로 나타난다. margin, padding 값을 가질 수 있다. 인라인 요소 a, span, strong, ··· 인라인 요소는 블록 요소를 포함할 수 없다. 블록 요소 이후 블록 요소를 사용하면 내용이 가로로 나타난다. 너비, 높이 값을 가질 수 없다. index.html..