다시 쓰는 이력서 by 동퐈

HTML의 컨테이너 요소는 레이아웃을 구성하고 스타일이나 스크립트를 적용하기 위해 그룹화하기 위해 사용하는 요소이다.  : division 아무런 의미를 갖고 있지 않는 태그다. 블록 레벨 요소를 가지고 레이아웃을 나누는 데 사용된다. : div와 동일하게 아무런 의미를 갖지 않는 태그다. 인라인 레벨 요소를 가지고 텍스트나 다른 인라인 요소를 꾸미기 위해 사용한다. 블록 컨테이너 요소 div는 블럭 레벨 요소로 레이아웃을 나누기 위해 사용합니다. 예제에서는 두개로 나눠진 레이아웃을 확인 할 수 있습니다. 인라인 컨테이너 요소 AI 코딩도구 윈드 서퍼 커서 코파일럿 , , , , , , 도 컨테이너 요소로 사용한..

은 행과 열을 나타내기 위한 마크업 요소이다.기본 자식요소로 를 갖는다.  : 테이블의 제목을 담당 : table row 테이블의 행을 의미 : table header 테이블 셀의 제목 : table data 테이블 행에 들어가는 내용 위 내용을 토대로 테이블을 만들어보면 이렇게 된다. 테이블 제목 셀 제목1 셀 제목2 셀 제목3 셀 제목4 셀 내용1 셀 내용2 셀 내용3 셀 내용4 셀 내용5 셀 내용6 셀 내용7 셀 내용8  HTML에서 표를 그리..

블록 인용문 우리가 할 수 있는 노력은 과정이 전부야. 결과는 우리 손안에 있는게 아니야. 결과까지 서너개 넣으려다 보니까 무리수를 두는 거야 드라마 <미생> 중에서  책이나 연설문, 논문의 일부 내용을 인용할 때 와 요소를 사용한다.는 텍스트가 긴 문장을 인용할 때 사용한다. 를 사용하면 자동으로 들여 쓰기가 적용되며 CSS margin 속성으로 들여 쓰기 간격을 바꿔줄 수 있다.출처 정보를 명시해야 할 때 를 사용한다. 과 시각적으로는 동일하지만 다른 성격을 가지고 있다.cite는 속성으로도 사용하는데 링크를 걸거나 시각적으로 보이지는 않지만 SEO나 스크린 리더등 웹표준과 웹 접근성 방면에서 이점을..

프레이징 요소는 문장 내에서 사용할 수 있는 요소들을 말한다.볼드체, 이텔릭체, 밑줄, 취소선 이런 요소들을 말한다.  같은 인라인 요소 안에서 사용 가능하며 대부분이 텍스트의 의미를 강조하는 역할을 담당한다. 강조 요소 : '강한 중요성'을 가진 내용을 위한 것, 텍스트 내에서 아주 중대하거나 긴급한 내용을 포함한다. <strong>과 <b> 비교 문장안에서 <strong>은 매우 중요한 내용임을 나타낸다. 문장안에서 <b>는 단순히 굵은 글씨를 나타낸다. 또 다른 프레이징 요소인 와 비교해 봤다. 과 는 단순히 봤을 때는 굵은 글씨로 보이지만 은 구조적으로 중요한 의미를 가지고 있는 요..

definition list를 의미하는 은 자식요소로 definition term, definition description을 갖는다. 사전이나 설명서, FAQ, 용어집 같이 글로 무언가를 표현할때 사용한다.  태그를 사용하면 문서 구조상 해당 컨텐츠가 설명형 목록임을 알 수 있고 웹 접근성을 요구하는 스크린리더 프로그램이 해당 컨텐츠가 설명 목록임을 알 수 있기 때문에 웹 표준을 준수하기 위해 사용해야한다.   HTML 웹 문서의 구조를 정의하는 마크업 언어 CSS 웹 문서의 스타일을 정의하는 스타일시트 언어 JavaScript 웹 문서의 동작을 정의하는 프로그래밍 언어  안에는 와 순서로 사용해야하며 복수로 사용 가능하다. , 이..

우리가 글을 쓸 때 어떤 순서에 따라 내용을 나열해야 할 때 1. 2. 3. 이런 식의 방식을 사용한다.HTML은 ordered list라는 태그를 사용하며 순서형 요소라고 부른다. 그 외에도 - * • 이런 다양한 기호들을 사용해서 중요한 내용을 나열하기도 한다.HTML은 unordered list이라는 태그를 사용하며 비순서형 요소라고 부른다.  두 태그 모두 어떤 내용을 나열하기 위해 사용하며 내부 요소로 라는 태그를 갖는다. list item이라는 의미를 갖는 자식 요소 는 부모 요소에 따라 다르게 나타난다. 순서형 HTML CSS JavaScript 비순서형 HTML CSS JavaScript  순서형 요소는 자식요소를..

HTML의 요소는 현재의 페이지에서 다른 페이지로 이동하기 위해 사용하는 요소이다. 우리가 흔히 말하는 링크를 만들 수 있는 대표적인 요소다.  인라인 요소로 작용하는 태그는 href 속성과 같이 써야 온전하게 쓸 수 있다.href는 링크를 클릭했을때 보내고 싶은 엔드 포인트를 작성해줘야 한다. 태그 사이에는 엔드포인트를 명시적으로 작성해야한다.W3Schools HTML Tutorial페이지 상단으로 이동cdh0283@gmail.com 메일보내기전화걸기 기본적으로 웹사이트 URL을 작성하면 그 주소로 이동한다. #을 작성하거나 #top를 작성하면 현재페이지의 최상단으로 이동하게 된다.mailto:(메일주소)를 작성하면 outlook이나 메일을 보낼 수 있는 어플리케이션이 동작된다.tel:(전화번호)를..

HTML에서 는 이미지를 넣기 위한 태그이다. 가장 많이 쓰는 요소 중에 하나이며 인라인 블록 레벨을 갖는다. 기본적으로 이렇게 사용한다. 이미지 태그를 사용할 때 반드시 포함되어야 하는 속성이 src와 alt이다.src는 보여지는 이미지의 경로를 의미한다. 외부의 이미지 주소를 넣을 수도 있고 혹은 컴퓨터에 저장된 이미지 경로를 넣을 수도 있다.alt는 이미지를 대체하는 텍스트이다. 만일 이미지가 보이지 않는 상황에서 alt에 작성한 텍스트가 보일 수도 있다. 하지만 유의할 점이 있는데 alt는 단순하게 작성해서는 안된다.  무슨 말이냐면 이런 이미지를 넣고 alt를 작성한다고 가정해 보자 단순하게 생각하면 '케이크 사진', '여러 가지 케이크', '케이크 소개' 이런 문구를 생각할 수 있을 것이다. ..

HTML 문서를 만들게 되면 주로 작업하는 공간은 태그 사이이다. 실질적으로 보이는 부분이기 때문이다.현재 우리는 HTML5로 작성된 웹페이지들을 보고 있다. ~ HTML에서 텍스트 혹은 이미지를 제목의 의미로 사용하고 싶을 때 사용한다. 은 대제목 는 소제목 순서로 까지 순차적으로 중요도가 낮아진다.의 경우 HTML을 대표하는 제목의 역할을 하기 때문에 해당 문서에서 1번만 사용할 것을 권장한다. 그 외의 요소들은 HTML 구조에 따라 중복으로 사용할 수 있을 것이다. 하지만 순서를 건너뛰는 것은 권장하지 않는다.그렇게 한다면 구조적으로 맞지 않기 때문이다. 마치 챕터를 건너뛰는 책은 없듯이. 문단은 태그를 사용해서 나타낸다. 문단이라는 의미를 가지고 있기 때문에 나 같은 요소를 포함 할 수 없다...

시멘틱 마크업(Semantic Markup)란? 시멘틱 마크업이란 HTML 요소가 의미(의도)를 가지도록 구성하는 것을 의미한다. 즉, 단순히 디자인이나 레이아웃을 위한 마크업이 아니라, 콘텐츠의 의미를 명확하게 전달할 수 있도록 HTML 태그를 사용하는 것을 말한다. 시멘틱 마크업 요소  : 머리말 (로고, 사이트 소개, 내비게이션 포함 가능) : 내비게이션 (메뉴) : 문서의 주요 콘텐츠 : 주제별 콘텐츠 구분 : 독립적인 콘텐츠 (블로그 글, 뉴스 기사 등) : 부가 정보 (사이드바, 광고 등) : 바닥글 (저작권, 연락처 등) 해당 내용을 HTML로 구현해봤다.카페 W를 가까이에서 경험해보세요.고객님과 가장 가까이 있는 매장을 찾아보세요!차별화된 커피 경험을 누릴 수 있는 리저브 매장 다양한 방..