CSS란? 먼저 CSS가 무엇인지 알아보자면 CSS란 Cascading Style Sheets의 약자로, HTML이나 XML 같은 마크업 언어로 작성된 문서의 시각적인 스타일과 레이아웃을 정의하는 스타일 시트 언어입니다. CSS는 웹 페이지나 앱에 디자인을 적용해서 예쁘게 보이고 화면을 직관적으로 만들어주는 역할을 합니다. CSS의 발전 스토리 CSS는 1996년 W3C(World Wide Web Consortium)에서 처음 소개되었다고 합니다. 초기에는 HTML과 CSS를 함께 작성하고, 스타일 규칙을 적용할 HTML 요소를 선택하는 방법이 간단하게 설명되어 있었는데 이는 대규모 프로젝트에서 유지보수가 어렵고, 팀원 간 작업 효율성이 떨어진다는 문제점이 발생했대요! 90년대에는 화려한 인터페이스를 만..

flexbox의 기본 개념 flexbox라 불리는 Flexible Box module은 flexbox 인터페이스 내의 아이템 간 공간 배분과 강력한 정렬 기능을 제공하기 위한 1차원 레이아웃 모델 로 설계되었습니다. flexbox를 1차원이라 칭하는 것은, 레이아웃을 다룰 때 한 번에 하나의 차원(행이나 열)만을 다룬다는 뜻입니다. 이는 행과 열을 함께 조절하는 CSS 그리드 레이아웃의 2차원 모델과는 대조됩니다. Flexhttps://developer.mozilla.org/ko/docs/Learn/CSS/CSS_layout/Flexbox Flexbox - Web 개발 학습하기 | MDN flexbox는 행과 열 형태로 항목 무리를 배치하는 일차원 레이아웃 메서드입니다. 항목은 부족한 공간에 맞추기 위해..

의미 요소(semantic element) HTML의 최신 버전인 HTML5에서는 시맨틱 웹(semantic web)이 중시되면서 여러 시맨틱 요소(semantic element)가 새롭게 만들어졌습니다. 의미 요소(semantic element)란 그 자체로 의미를 가지고 있는 요소를 가리킵니다.즉, 요소가 자기 스스로 브라우저와 개발자 모두에게 자신이 사용된 의미를 명확히 전달해 주는 요소를 의미합니다. 의미 요소가 아닌 div 요소나 span 요소 등은 해당 요소가 무슨 목적으로 사용되었는지 코드를 살펴봐야 알 수 있습니다.하지만 의미 요소인 table 요소는 코드를 보지 않아도 해당 요소가 표를 만드는 데 사용되었다는 것을 이름만 살펴봐도 바로 알 수 있습니다. 시맨틱 요소를 사용해야 하는 이유 ..

선택자(selector) CSS에서는 스타일을 적용할 대상을 선택하기 위해서 선택자(selector)를 사용합니다. 대표적인 선택자는 다음과 같습니다. 전체 선택자 HTML 요소 선택자 아이디(id) 선택자 클래스(class) 선택자 그룹(group) 선택자 자식 선택자 후손 선택자 형제 선택자 인접 형제 선택자 기타선택자 전체 선택자 // * CSS를 적용할 대상으로 HTML 문서 내부의 모든 요소를 선택합니다. HTML 요소 선택자 // 해당 요소 태그 CSS를 적용할 대상으로 HTML 요소의 이름을 직접 사용하여 선택할 수 있습니다. ... 이 부분에 스타일을 적용합니다. 아이디(id) 선택자 // # 아이디 선택자는 CSS를 적용할 대상으로 특정 요소를 선택할 때 사용합니다. 이 선택자는 웹 페이..

HTML HTML: Hypertext Markup Language | MDN HTML(HyperText Markup Language)은 웹을 이루는 가장 기초적인 구성 요소로, 웹 콘텐츠의 의미와 구조를 정의할 때 사용합니다. HTML 이외의 다른 기술은 일반적으로 웹 페이지의 모양/표현 (CSS), 또는 기 developer.mozilla.org HTML(Hypertext Markup Language)은 웹 페이지와 그 내용을 구조화하기 위해 사용하는 코드입니다. HTML은 웹 브라우저에 표시되는 글과 이미지 등의 다양한 콘텐츠를 표시하기 위해 "마크업"을 사용합니다. HTML 마크업은 다양한 "요소"를 사용하는데, 요소에는 많은 종류가 존재합니다. , , , , , , , , , , , , , , ,..