코딩의 아름다움

HTML5 구조 관련 복습 중, 괜찮은 내용의 블로그를 찾아서 공유합니다. 출처는 아래 명시해 뒀습니다. 웹문서의 본문을 구성하는 요소들중에 SECTION을 구성하는 요소에 대하여 알아봅니다.BODY 요소 요소는 문서의 본문 영역을 표시한다. 본문 영역은 실제 콘텐츠가 표현되는 공간이며, 이 공간에서 사용자와의 상호작용이 실질적으로 이루어진다. 또한 body 요소는 브라우저가 렌더링해야 할 범위를 알려준다.HEADER 요소HTML5에 새롭게 추가된 요소로서, 웹 문서 맨 윗부분에 있으며 웹 사이트 이름, 글로벌 링크(로그인, 회원가입, 사이트맵, 언어 선택등 웹사이트 어느 곳에서든지 이용할 수 있는 링크)등으로 구성된 영역이다.HTML LOGO 검색 사이트 이름(로고), 내비게이션, 헤드라인, 검색 등으..

출처 : http://ccl.cckorea.org/syntax/#section [Markdown] 마크다운 문법 - 깃허브 위키 목차목차에서 제외하기제목 h1, h2, h3, h4두꺼운 스타일링크일반 링크새창으로 링크새창으로 버튼 링크자동 링크문단 (p)인용 (blockquote)정렬가운데 .text-center왼쪽 .text-left오른쪽 .text-right각주축약어 (HTML)테이블깃헙 마크다운 도움말 페이지 링크목차0. TOC (순서없는 목록) - 숫자로 시작 {:toc} * TOC (순서 목록) - 목록형으로 시작 {:toc} # 디자인 시안처럼 목록 스타일 없이 직접 제목으로만 목차를 구성하고 싶으면 아래처럼 `no-style` 클래스를 추가합니다. * TOC (목록 스타일 없는 목록) {:t..

안녕하세요. 오늘은 HTML/CSS 구글 폰트 적용 방법을 알려드리겠습니다. 우선 구글에 google fonts 검색하시거나 아래 주소 링크로 들어갑니다. https://fonts.google.com 에 접속하면 여러가지 무료공개 폰트가 뜨는데요. 사용하고자 하는 폰트를 클릭합니다. 저는 Nosifer 을 사용해 보도록 하겠습니다. 해당 폰트를 클릭하시거나 + 누르시면, 다음과 같은 창이 뜹니다. SELECT THIS FONT 클릭하세요. 클릭하면 다음 과 같은 창이 뜨는데, 해당 링크와 예제를 보고 사용하시면 됩니다. 혹시 모를 초급자를 위해 소스 공개해서 설명드릴게요. Google 폰트 설정.font-family-1{font-family: 'Nosifer', cursive;}폰트 확인용 글자입니다~h..

Favicon 설정 방법 및 무료 이미지 변환 사이트 소개 파비콘(Favicon) 은 (favicon - Favorites + Icon의 합성어)이란 웹사이트나 웹페이지를 대표하는 아이콘입니다. 위와 같이 사이트를 대표하는 아이콘인데요. 이미지 파비콘 무료 변환 및 HTML 설정 방법을 간단하게 설명해 드리겠습니다. 첫째로, 사용하고자 하는 이미지를 준비합니다. 두번째, 무료 변환 사이트인 https://www.favicon-generator.org/ 을 접속합니다. 세번째, 파일 선택을 누른 후, 준비한 이미지를 선택한후 Create Favicon 을 클릭합니다. 네번째, 아래 그림에서 첫번째 Download the generated favicon 클릭후, 바탕화면 img 파일폴더 생성후 img 폴더에..