새싹캠퍼스10 [새싹x코딩온] 웹 개발자 부트캠프 과정 2주차 회고 | CSS - flex 오늘은 CSS의 display 속성에서 배치를 결정하는 Flex에 대해서 소개해보려 한다. 화면 레이아웃을 구성할 때 많이 사용한다. 그럼 Flex란 무엇이고 왜 필요할까? 예를 들어 웹사이트에 여러 콘텐츠를 배치한다고 하자. 인프런 사이트를 예시로 가져와보면 다음과 같다. '왕초보도 할 수 있어요'를 header라 하는데, 개발자 도구 내에서 flex 속성을 바꿔보면 가운데로 오게 할 수 있다. 이렇듯 각각의 요소들의 배치를 보기 좋게 만드는데 적극적으로 사용될 수 있다. 극단적으로 비유해 보자면 문서 작업 시의 가운데 정렬, 왼쪽 정렬 등과 같은 느낌이다. 1. Flex 속성 적용을 위한 개념 먼저 flex 속성을 사용하기 위해서는 몇 가지 개념을 알아야 한다. 1) flex-container fle.. 2023. 7. 25. [새싹x코딩온] 웹 개발자 부트캠프 과정 1주차 회고 | html & semantic 1. HTML이란 우선 html은 hypertext markup language의 줄임말이다. 여기서 hypertext란 링크를 연결하기 위함을 뜻하고, markup은 문서나 데이터의 구조를 명기하는 것이라고 한다.(명기하다: 분명하게 밝히어 적다. 출처: 네이버 사전) 즉, 웹페이지를 연결하고 구조화하는 언어라고 볼 수 있다. 2. HTML의 기본 구조 ! + tab: html 기본 구조 자동 완성 위와 같은 단축키를 입력하면 html의 기본 구조가 나온다. 은 문서 형식을 최신 버전인 HTML5로 지정하는 것이라고 한다. 그 이후 과 안에 head와 body 구조를 갖게 된다. 이때 head와 body는 같은 수준의 들여 쓰기를 가진다. 이와 같은 들여 쓰기는 대표적인 컴퓨팅 언어의 구조로 어떤 것 .. 2023. 7. 20. 이전 1 2 3 다음
