'웹페이지'에 해당되는 글 (22건)

FastBoot 스킨 그래픽 아이콘 폰트 Font Awesome 조절 사용하기 웹문서를 보면 그래픽 아이콘이 문서를 보기 좋게 장식하고 있는 것을 볼 수있다. 그중 많은 그래픽 아이콘이 이미지 아이콘이 아니고 폰트(글꼴)로 제공되어 표시되고 있으며 폰트(글꼴)와 같이 크기와 색상 조정이 가능하다. 구글 아이콘 폰트, 부트스트랩 아이콘 폰트(glyphicon), 어썸(Awesome) 폰트 등 여러 아이콘 폰트가 제공되고 있으며 glyph icon이라 불린다. 본 블로그 스킨은 FastBoot 스킨이며 Awesome Font 아이콘을 사용하고있다. FastBoot 스킨에서 사용하고 있는 Awesome Font 아이콘 아이콘 name 아이콘 사용 아이콘 아이콘 name 아이콘 사용 cogs 관리자 lock L..

구글 웹폰트 적용 및 문제점 정리 구글 폰트서비스는 현재(2018년 3월) 854개의 웹폰트를 제공하고 있으며 제공되는 폰트를 적용하는 방식도 제시하고 있습니다. 개발자 도구로 웹페이지를 보면 CSS 파일에 설정한 폰트(글꼴)로 표시되지 않는 경우가 더러 보입니다. 작성한 웹페이지(블로그 등)에 어느 폰트가 표시되는지 아래글을 참조하면 알 수있습니다.▶2018/03/06 - [웹페이지] - 웹페이지 이 글꼴(font)은 무슨 글꼴인가 획인하기-WhatFont tool 티스토리 블로그에 나눔고딕 폰트 위주로 구글 웹폰트를 적용하는 방법과 문제점에대해서 몇가지 정리해봅니다. 1. 구글 웹폰트(google font api) 적용  ★ link ★@import ★ font-family 작성2. 구글 웹폰트 ap..

※웹페이지 글꼴(font) 알아보는 툴: whatfont tool 블로그 등 웹페이지를 볼 때 때때로 마음에 드는 글꼴(font)을 발견하는 경우 적용된(render됐다고 하지요) 글꼴이 무슨 글꼴인가 알 수있는 방법 또는 자신의 웹페이지에 설정한 글꼴이 제대로 적용되는가 알아 볼 수있는 방법에 대해 기술해보겠습니다. whatfont tool 설치 whatfont tool 설치 페이지는 북마클릿 및 확장프로그램(크롬, safari) 설치를 제공하고 있습니다. 북마클릿이란 작은 크기의 자바스크립트 코드를 북마크에 저장해 두는 것을 말한다. ◈ WhatFont 설치 페이지 북마클릿 설치 위 이미지는 Bookmarklet 탭이 선택된 화면입니다. ▶ 크롬에서 설치> ▼ whatfont 박스를 북마크바탭에 드래..

※FastBoot 스킨 머리말(h1-h4) 인용문(blockquote) 모양 바꾸기 많은 티스토리 블로거들이 FastBoot 스킨을 사용하고 있는 것을 보게됩니다. 저도 FastBoot 1.6.2 스킨을 사용하고 있습니다. 티스토리 블로그를 사용하는 이유는 애드센스 광고를 게시할 수있고 또한 스킨 기본 설정 변경이 어느 정도까지는 자유롭다는 것이지요. 글 작성시 머리말 인용문 등을 사용해 가독성을 높히고 내용을 강조합니다. 머리말, 인용문의 모양(디자인)은 스킨별로 또는 같은 스킨을 사용하는 블로그라도 다른 모양으로 표시되는데요. 대부분의 경우 테두리 모양과 배경 모양입니다. 머리말과 인용문의 모양을 변경해보겠습니다. ★머리말 스타일 변경 ★인용구 스타일 변경 1. 머리말 스타일 변경 ▲변경 전 모양 티..

★티스토리 블로그 본문 글자 크기 설정-CSS, 스킨위자드 티스토리 블로그를 운영하기 위해서는 HTML 태그와 CSS 스타일에 대해서 어느 정도 지식을 요합니다. 티스토리 블로그의 본문 글자 크기를 조절하는 방법 두가지를 들겠습니다. 1. CSS 스타일 수정 2. 스킨위자드에서 수정 CSS 스타일 수정 티스토리 블로그 본문은 HTML "article" 클래스를 갖고있는 태그에 실려있습니다. 본 article 클래스의 스타일에서 본문 글자 크기를 수정합니다. 블로그 관리화면 좌측메뉴 항목에서 "꾸미기=>스킨편집"을 선택합니다. 스킨편집화면 우측상단 "html 편집을"" 선택합니다. html 편집화면 우측상 "CSS"를 선택하면 CSS 파일이 열립니다. 여기서 control+F(검색)을 눌러 aticle을 ..