본문 바로가기
반응형

분류 전체보기177

[CSS] Box Model - 기본 요소 안녕하세요 냥장판 입니다 지난 게시글에 이어서 CSS에 Box Model에 대해서 알아볼게요. HTML에는 태그/요소들이 있죠. (둘이 같은말입니다) 모든 요소들은 공간을 차지하고, 이 면적을 결정하는 데 필요한 개념이에요. CSS box model은 위의 그림처럼 4개의 속성들로 이뤄져있어요 Content – The text, image, or other media content in the element. Padding – The space between the box’s content and its border. Border – The line between the box’s padding and margin. Margin – The space between the box and surroundin.. 2020. 1. 30.
로케일(Locale) 이란? 목표: 로케일 요소에 대해 파악하고, CLDR에 대해 알아보자 안녕하세요 냥장판 입니다 🐱‍👤🐱‍👤 이번 게시글에서는 여러 국가에 날짜, 시간 등을 로케일(Locale) 요소를 검색할 때 유익한 개념을 알려드리려고 합니다. 천천히 잘 따라와 주길 바랍니다. 우선 로케일 요소에는 날짜, 시간, 달력, 소수점, 환율 등 여러가지 요소가 존재한다. 1. 날짜, 시간(Date & Time) 해외에서 구입한 화장품이나 식료품의 유통기한이 연도를 말하는지, 월을 말하는지 모를 때가 있었을 것이다. 년도라도 써있으면 감으로 맞추겠지만 그렇지 않은 경우들이 더 많다. 한 예로 같은 영어권 국가에서 날짜를 표시하는 방식이 다르다는 것을 경험한 적이 있는지 모르겠다. 2020년 1월 10일에 대해 표기하는 방법이 국가마다.. 2020. 1. 29.
[기타] Emoji로 무료 Domain 등록하기 목표: Emoji로 된(e.g. 😀😐🍔🍟.net) 도메인 등록하기! 요약 Emoji 선택하기 - emojipedia.org Punycode 전환하기 - punycoder.com Domain 등록하기 - Punycode 붙여넣기 티스토리 블로그 내 2차 도메인 설정 안녕하세요 냥장판 입니다 이번 게시글에서는 도메인(Domain)을 등록해볼건데요 이모지(Emoji)로 등록할거에요. 자신의 블로그 주소(miaow-miaow.tistory.com)는 1차 도메인이고요. mycats.ga , 냥장판.com 으로도 도메인을 등록하고 이를 2차 도메인이라고 합니다. 그리고 😀😐🍔🍟.ga 이런 주소가 있을 수도 있거든요!!! 이모지를 도메인 주소로 만드는 방법 알려드릴게요! 1. Emoji 선택하기 - emojiped.. 2020. 1. 29.
[Tistory] 티스토리에 Google Fonts 적용하기(폰트 변경) 목표: 티스토리에 Google Fonts를 적용해서 폰트 변경하기 Google Fonts 에서 마음에 드는 폰트 고르기 어떤 글자를 바꿀지 결정하기(Chrome 개발자도구: 키보드 F12) 티스토리 스킨편집 > HTML 편집 안녕하세요 냥장판입니다. 이번 게시글에서는 티스토리 블로그에서 글씨체를 변경하는 걸 해볼거에요. 폰트는 Google에서 제공하는 무료 폰트를 사용할 겁니다! 기본적인 방법이 궁금하시다면(?) 아래 게시글을 참고하세요! 2020/01/23 - [놀고있네/HTML & CSS] - [CSS] CSS에서 Google Fonts 사용하기 1. Google Fonts 에서 마음에 드는 폰트 고르기 Google Fonts에 들어가서, 마음에 드는 폰트를 고릅니다. 마음에 드는 폰트 상단에 [+].. 2020. 1. 28.
[Tistory] Sitemap, 사이트맵 등록 (Bing - Microsoft) with Google Bing 웹마스터 도구, Google 로그인 IMPORT Google Search Console 자동으로 사이트맵, 소유권 등록 됩니다! 안녕하세요 냥장판 입니다 이번 게시글에서는 Bing 브라우저에 티스토리 블로그를 등록하고, 사이트맵까지 한번에 할 수 있는 방법을 알려드릴게요 Bing은 점유율이 Google 다음으로 높지만... 낮습니다 그래도 검색 엔진으로써 가장 기본에 충실하고 객관적인 정보들을 많이 제공해요! Bing 에 블로그를 등록하기 전에 해야할 일이 있어요! 아마 다들 하셨을 거라고 생각합니다. Google search console에 블로그 등록이 되어있어야해요 2020/01/08 - [기타] - [Tistory] Sitemap, 사이트맵 등록 (Google - search consol.. 2020. 1. 28.
[CSS] CSS에서 Google Fonts 사용하기 목표: Google에서 제공하는 Web Font를 CSS와 HTML에 적용해보자 요약 Google Fonts 접속 Language 선택 폰트 선택 코드 복사 안녕하세요 냥장판 입니다 이번 시간에는 CSS에 Google Fonts를 적용하는 방법에 대해 알아볼거에요. CSS파일 없이 HTML에만을 사용해서 Google Fonts를 적용하고 싶다면 아래 게시글을 참고하세요 2019/11/21 - [기타] - [Font] Google Fonts 사용하기 [Font] Google Fonts 사용하기 목표: Google에서 제공하는 Web Font를 사용해보자 요약 Google Fonts 접속 Language 선택 폰트 선택 코드 복사 1. Google Fonts 접속 Google Fonts URL: https:.. 2020. 1. 23.
[CSS] CSS 선택자 사용법 안녕하세요 냥장판 입니다 CSS는 HTML과 같은 마크업언어의 디자인을 위한 언어에요. CSS도 기본 문법이 존재하고, 그 문법을 기반으로 HTML과 연결됩니다. 이번 게시글에서는 선택자를 사용하는 방법에 대해서 알려드릴게요. 1. 선택자 사용 방법 기본 개념은 HTML의 태그 값을 선택자에 가져다가 쓰는 거죠. 이 선택자를 어떻게 가져오는지에 따라 사용 방법이 달라요. 선택자를 사용하는 방법은 크게 4가지입니다. HTML 태그/요소 그룹(group) 아이디(id) 클래스(class) style="display:inline-block;width:740px;height:200px" data-ad-client="ca-pub-9512983930357661" data-ad-slot="5785466884"> 2... 2020. 1. 22.
[Tistory] 블로그에 방명록 바로가기 버튼 만들기 안녕하세요 냥장판 입니다 제 블로그는 Poster 스킨을 사용하고 있어요. 방명록이 메인커버 하단에 있어서 다들 못보셨을거에요 😂 이번 게시글에서는 방명록 바로가기 버튼을 만드는걸 해볼거에요! 1. HTML 문서 수정 페이지 > 이미지 파일 업로드 블로그 관리페이지로 들어가면, 스킨 편집 메뉴가 있어요 우측에 스킨편집 > HTML 버튼을 누릅니다. 파일 업로드 메뉴로 들어가요 아래 추가 버튼을 클릭하고, 이미지를 업로드해요 이미지 파일명을 꼭 기억해두세요 제가 올린 이미지 파일은 guest.png 파일입니다. 파일 주소는 images/guest.png 입니다. data-ad-unit = "DAN-1if0if4df9b39" data-ad-width = "320" data-ad-height = "50"> 2.. 2020. 1. 21.
[CSS] CSS 기본 문법, 사용방법 안녕하세요 냥장판 입니다 앞에서 CSS 개념에 대해 배웠었죠 이번 게시글에서는 CSS 문법에 대해서 살펴볼거에요. 1. CSS 기본 구조 CSS는 선택자(selector)와 선언부(declaratives)로 구성됩니다. 선택자는 CSS를 적용하고자 하는 HTML Tag/elements가 오고요 선언부는 중괄호({ })안에 위치하고, 선언들은 세미콜론(;)으로 구분합니다. 선언부는 하나 이상의 선언들을 세미콜론(;)으로 구분하여 포함할 수 있으며, 중괄호({ })를 사용하여 전체를 둘러쌉니다. 각 선언은 CSS 속성명(property)과 속성값(value)을 가지며, 그 둘은 콜론(:)으로 연결됩니다. 이러한 CSS 선언(declaration)은 언제나 마지막에 세미콜론(;)으로 끝마칩니다. style=".. 2020. 1. 21.
반응형

티스토리툴바