콘요맘떼 개발일지

1. Inline Element - , , , , , 등이 있다. - content의 너비만큼 라인을 차지하며 한 라인에 여러 개의 요소가 올 수 있다. - inline 요소의 상·하 여백은 margin이 아닌 line-height에 의해 결정된다. - inline 요소에는 width, height이 적용되지 않는다. - inline 요소가 연속 사용되는 경우 약 5px의 외부 margin이 자동 생성된다. 2. Block Element - , , , , , , , , , , 등이 있다. - 화면 전체 너비를 차지한다. - width : 100% 속성을 기본적으로 가지고 있다. (이로 인해 자동 줄넘김 발생) 3. display 속성 태그가 Inline인지 Block인지 결정해주는 것은 display 속..

1. Inheritance (상속) - CSS에서 한 엘레먼트에 스타일을 주면 그 자식들 역시 영향을 받는다. - 모든 스타일이 상속되는 것은 아니며 border, margin, padding, border 등은 상속되지 않는다. 2. Cascading (캐스케이딩) - 한 대상에 대해 중복되는 스타일 선언이 존재할 경우 어떤 스타일을 선택할지에 대한 규칙이다. - 캐스케이딩은 중요도, 명시도, 순서 이렇게 3가지 규칙에 따른다. (1) 중요도 CSS 소스의 출처로부터 중요도를 구분한다. (먼저 언급될수록 우선순위가 높다) !important 속성 개발자 CSS 인라인 스타일 style 태그 link 태그로 가져온 stylesheet css 파일 유저 CSS : 폰트 설정 등 사용자가 브라우저에 적용한 ..

1. CSS (Casading Style Sheets) - HTML이나 XML로 작성된 문서의 표시 방법을 기술하는 Style sheet 언어 (프로그래밍 언어, 마크업 언어 둘 다 아님!) - HTML에서 디자인을 위한 새로운 태그들을 추가하였으나 해당 방법이 한계가 있음에 따라 CS가 등장하였다. Rule set (줄여서 Rule) - 선택자(Selector) : 꾸며줄 요소를 선택 - 선언(Declaration) : 꾸미길 원하는 요소의 소성 묘사 (각 선언은 ;를 통해 구분한다) 2. 선택자(Selector) 종류 (1) 전체 선택자 - * 모든 요소를 선택한다. (2) 태그 선택자 (요소 선택자) ex) p, div 특정 태그의 엘레먼트를 모두 선택한다. (3) 아이디 선택자 - #id 특정 아..

UI를 목적으로 태그 아래 들어가는 태그들이 아닌, 주로 태그 아래에 들어가며 메타 데이터를 담기 위한 태그들을 학습한다. 1. - DTD(Document Type Definition)이라고 불리며 브라우저에게 현재 웹페이지의 형식을 알려준다. - 브라우저는 이를 통해 해당 형식 및 버전을 기준으로 해당 페이지를 해석한다. 2. - 웹페이지의 시작과 끝을 알려준다. - 전역 속성(Global Attribute)를 자주 사용한다. (대표적으로 lang 속성을 통해 메인 언어 명시) ex) 3. - 웹페이지의 메타데이터를 작성하거나 외부 파일들을 링크하는데 사용한다. - 태그가 실제 사용자에게 보여지는 UI적 요소들의 최상위 컨테이너라면 는 사용자에게 보여지지 않는 것들이 담기는 곳이다. - 메타데이터를 담..

1. Semantic VS Non-Sematic : Content에 의미 부여하는가? (1) Semantic Tag (시멘틱 태그) - 자신이 무엇을 표현하는지 브라우저와 개발자에게 명확하게 설명해준다. - 개발자의 측면 : 웹 페이지의 구조를 보다 쉽게 파악할 수 있다. - 검색엔진의 측면 : 검색엔진은 봇을 통해 웹페이지들을 크롤링한다. 이 봇들은 시멘틱 태그에 담긴 요소들을 중요한 텍스트로 바라보기 때문에 검색어와 시멘틱 태그 컨텐츠가 잘 매칭되는 페이지를 우선으로 보여준다. 따라서 시멘틱 태그를 활용하면 검색엔진 최적화(SEO)를 달성할 수 있다. - 시멘틱 태그의 예시 : , , , , , , , , , ... ※ 태그와 태그의 차이점 section은 chapter, header, footer ..

HTML (Hyper Text Markup Language) 웹페이지가 어떻게 구조화되었는지 브라우저가 알 수 있게 해주는 마크업 언어이다. 웹 컨텐츠에 부가적 기능을 부여하는 CSS 혹은 Javascript와 달리 HTML은 웹 컨텐츠의 의미와 구조를 부여한다. 따라서 HTML 없이는 웹 페이지를 구성할 수 없다. → 한 마디로 웹 컨텐츠가 화면에 표시되는 형식을 정의하는 언어 ※ 마크업 언어 일반적 텍스트와 구별하기 위해 일반적 텍스트에 주석·태그 등을 붙인 것 HTML Element (HTML 요소) - HTML Element는 태그들과 그 사이의 Content로 구성되어 있다. - 태크는 여는 태그(Opening Tag, Start Tag)와 닫는 태그(Closing Tag, End Tag)가 있..