CSS

개인 프로젝트 레이아웃을 잡다가 Flex를 잘 쓰고 싶어서 인프런 강의를 수강하였다.강의 들으면서 정리한 내용을 작성해보았다. 1. container에 display: flex; vs display: inline-flex; ... AAAAAAAAAAAA BBB CCCCCCC  2. responsive와 flex-item: 1브라우저 너비 601px 일 때 flex-item에 flex:1브라우저 너비 601px 일 때 flex-item에 flex:1 주석브라우저 너비 594px 일 때 3. align-items는 기본 값이 stretch 4. align-content는 wrap으로 넘어갔을 때, cross축 정렬을 어떻게 할 것인지 결정5. flex-item에 적용하는 속성인 flex-grow는 남는..

1. 인라인 스타일 app.style.background = '#000'; app.style.setProperty('background', '#f00'); cssText는 기존에 설정된 inline이 날아감 app.style.cssText = ` background: #fff; max-width: 500px; width: 100%; margin: 100px auto; padding: 20px; border-radius: 6px; box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.1); `; app.style.removeProperty('box-shadow'); 2. 스타일 시트 document.styleSheets[0].insertRule(` #app { background: #f..

HTML* HTML(Hypertext Markup Language,하이퍼텍스트 마크업 언어)우리가 보는 웹페이지가 어떻게 구조화되어 있는지 브라우저로 하여금 알 수 있도록 하는 마크업 언어HTML은 elements로 구성, 적절한 방법으로 나타내고 실행하기 위해 각 컨텐츠의 여러 부분들을 감싸고 마크업 * 태그 HTML의 tags 는 문서의 내용을 구조화, 의미 부여 검색 엔진이 문서의 내용을 이해하고 적절히 처리하는 데 중요한 역할 태그 브라우저에 표시 되지 않음 태그 메타데이터(작성자, 중요한 키워드와 같은 HTML에 대한 내용)를 포함 메타데이터는 데이터를 설명하는 데이터이다구성) character set / 작성자 name / 내용 content이 설명은 검색엔진 결과 페이지에서도 사용된다 * i..