잰니의 성장블로그✈

플렉서블 박스(Flexable Box) 플렉서블 박스는 간단히 플렉스 박스(FlexBox)라고도 하는데 박스를 쉽게 가변적으로 만들어 주고 동시에 반응형 웹을 위한 몇 가지 기능도 제공해주는 최신 기술이다. 플렉스 박스는 컨테이너(Container)와 아이템(Item)이라는 두 개의 개념이 필수적으로 존재해야 한다. 아이템이 컨테이너 안에 들어 있게 된다. Flex Box 장점 콘텐츠를 수평 방향으로 쉽게 중앙 정렬할 수 있다. 뷰 포트의 너비에 따라 요소의 배치 순서를 달리 할 수 있다. 박스 내 요소의 여백과 배치를 자동으로 조절 할 수 있다. Flex Direction의 속성 값 row 기본 값, 플렉스 박스의 아이템을 수평 방향으로 배치(좌->우) row-reverse 속성 값 row와 동일하나 ..

이미지(IMG) 웹 페이지에 이미지를 사용하려면 태그를 사용한다. 이미지를 삽입할 때 태그와 이미지의 너비와 높이를 설정하는 width와 height속성도 지정해야한다. 이미지 경로는 절대경로(무조건 최상위 위치)와 상대경로(html파일과 같은곳)로 입력하면 된다. 상대경로는 ./~로 시작되지만 ./를 생략해도 된다. 상대경로에서 현재 경로는 ./ 이고 하나 위 경로는 ../, 두 개 위 경로는 ../../ ~로 위치를 나타낸다. 이미지 파일 종류와 설명 포맷 설명 jpg 24비트 트루컬러, 사진 이미지, 파일크기를 줄일 수 있음 png 24비트 트루컬러, 무손실 압축, 휴대폰 등에서 고화질 유지, 최근 널리 사용 gif 8비트(256컬러), 무손실압축, 그래픽 이미지에서 널리 사용, 파일크기 작음 sv..