본문 바로가기
반응형

flex2

웹디자인 기능사 시험 연습 웹디자인 기능사 시험 연습 오늘 웹디자인 기능사 시험을 연습해봤습니다. 웹디자인 기능사 중 레이아웃만 연습을 해봤습니다. 연습 문제는 Q-Net에 올라와있는 시험 문제를 활용해서 시도해봤습니다. (https://www.q-net.or.kr/cst006.do?id=cst00602&gSite=Q&brdId=Q006&code=1204&artlSeq=5199079) 그 중 A타입 유형, B타입 유형, C타입 유형을 연습했습니다. 다행히 레이아웃 만드는 방법은 수업시간에 잘 가르쳐 주시고 연습을 많이 해서 엄청 어렵진 않았습니다. 방법 중에는 flex를 사용해서 했습니다. 각 유형을 확인해보니 유형 내에서 지정해 놓은 footer 구역이 서로 변화가 있습니다. A타입 유형 로고 메뉴 이미지 슬라이드 공지사항 갤러.. 2023. 3. 16.
레이아웃 - flex 유형 레이아웃 - flex 유형 flex layout은 요소들이 포함된 큰 박스에 flex를 선언하고, 안에 있는 요소들에게는 유연하게 배치하는 속성들을 부여하는 레이아웃을 잡는 것이다. display: flex;​ 위의 구문을 사용해서 해당 요소에 flex로 레이아웃을 설계한다고 선언하면 됩니다. flex 유형은 부모의 자식에만 사용할 수 있고 부모의 자식의 자식에는 사용할 수 없으니 참고하세요. 이제 flex유형을 사용해서 예시를 만들어 보겠습니다. 1920px * 1080px의 사이즈에 1200px * 1080px 구역 레이아웃을 만들어 보겠습니다. 작성 방법 전체 구역을 만들어주고 각 구역을 하나씩 만들어 줍니다. header 구역, nav 구역, main 구역, footer 구역을 만들어줍니다. he.. 2023. 3. 1.
반응형