YoonStudyNote

독립적으로 구분되거나 재사용 가능한 영역을 설정(매거진/신문 기사, 블로그 등) 일반적으로 ~를 포함하여 식별 작성일자와 시간의 datetime 속성으로 작성 블록요소로 되어있다. Weather forecast for Seattle 03 March 2018 Rain. 04 March 2018 Periods of rain. 05 March 2018 Heavy rain. 다음과 같이 article태그 안에 article을 쓸수 있다. 자식요소 article은, 만약에 부모article에서 빠져나와서도 그것만의 독립적인 의미를 가지고 있게 된다면 자식 요소는 다른 태그가 아닌 article을 사용해야한다.

문서의 주요 콘텐츠를 설정. IE 지원 불가 한 문서에 하나의 요소만 포함 가능.

6단계의 문서 제목을 구현한다. 구획 단계는 이 가장 높고 는 가장 낮다. 제목의 정보는 자동으로 문서의 목차를 만드는것 처럼 사용자 에이전트에 사용될 수 있다. 제목 폰트의 크기를 줄이기 위해 낮은 단계를 사용하지 마라. 대신에 CSS의 font-size 속성을 사용해라. 제목 단계를 건너뛰는 것을 피하라, 언제나 로 시작해서, 순차적으로 기입해라. 첫 번째 단계의 제목은 한 페이지에 하나만 적용해라. Heading elements Summary Some text here... Examples Example 1 Some text here... Example 2 Some text here... See also Some text here... h1은 딱 한번만 사용할 수 있지만, 다음과 같이 h2나 h3와..

FOOTER는 일반적으로 작성자 구획, 저작권 데이터, 관련된 문서의 링크에 대한 정보를 포함한다.

1. HEADER 헤더 부분은 헤더태그를 만들고 내용을 그 안에 넣어야 한다. Personal Open Source Business Explore 요소는 소개나 탐색을 돕는것의 그룹을 나타낸다. 이것은 일부 제목 요소들을 포함할수도 있지만, 로고나 구획의 제목, 탐색 폼과 같은것들이 포함할수도 있다. 단, 다음과 같이 header안에 header가 또 들어갈 수 없다. 또한 footer도 들어갈 수 없다.

반드시 코드를 입력할때는 안에서 작성해야한다. 그안에서 코드를 읽고 작성하는것이 된다. 문서의 구조

Personal Open Source Business Explore body { margin: 0; padding: 0; } .header { background: white; border-bottom : 1px solid lightgray; /*밑줄선으로 1px 두께에 그냥줄로 빨간색으로 하겠다*/ } .container { width: 980px; margin: auto;/*화면 중앙으로 이동해줘*/ } .container-left { padding-top : 20px; /*padding은 최상위 요소에서 고치는것보다는 당장 효과를 봐야하는 작은 요소에서 설정하는것이 좋다*/ padding-bottom : 20px; } .logo { float: left; margin-right : 5px; } .l..

1. CSS 기본 문법 CSS문법은 HTML보다 더 쉽다. 아래 예시처럼 선택자, 속성, 값이 있으며 무엇을 의미하는지 이해하는 것으로 문법은 충분하다. div{ font-size : 20px; color : red; } /*다음과 같이 이해할 수 있다.*/ 선택자{ 속성 : 값; 속성 : 값; } 2.선택자의 역할 선택자는 HTML에 스타일(CSS)을 적용하기 위해서 HTML의 특정한 요소를 선택하는 사인이다. 적용할 스타일을 속성(color)과 값(red, blue)으로 나타내고 적용할 대상(h1, p)을 선택자로 나타낸다. 제목.. 본문.. h1 { color: red; } p { color: blue; } /*빨강 글자색(CSS, color: red;)을 저기 제목(HTML, )에 적용하겠어!” ..

안에서 사용하는 태그들은 HTML 문서의 구조를 나타낸다. 1. DIV(막 쓰는 태그) 의 'div'는 division의 약자로 분할을 뜻하고 문서의 부분이나 섹션을 정의한다. 명확한 의미를 가지지 않기 때문에 정말 많은 경우 단순히 특정 범위를 묶는 용도로 사용한다. 보통 이렇게 묶인 부분들에 CSS나 JS를 적용하게 된다. 2. IMG(이미지 넣는 태그) 는 HTML에 이미지를 삽입할 때 사용한다. 웹 페이지에 이미지를 삽입하는 방식은 크게 2가지로, 'HTML에서 삽입(IMG)'와 'CSS에서 삽입(background)'가 있다. 속성 의미 값 src (필수) 이미지의 URL URL alt (필수) 이미지의 대체 텍스트(alternate)를 지정 3. 웹 표준 검사하기 우리가 작성한 HTML 문서가..

안에서 사용하는 태그들은 HTML 문서의 정보를 가지고 있다. 1. TITLE(웹 페이지의 제목) HTML 문서의 제목을 정의한다. 웹 브라우저의 각 사이트 탭에서 이름으로 표시된다. 2. META(웹 페이지의 정보) HTML 문서(웹페이지)에 관한 정보(표시 방식, 제작자(소유자), 내용, 키워드 등)를 검색엔진이나 브라우저에 제공한다. 빈(Empty) 태그이다.