티스토리 스킨을 고치거나 만들기 위해서는 먼저 에이치티엠엘(HTML)과 시에스에스(CSS)를 알아야 한다. 티스토리 관리자 화면에서 스킨 편집으로 들어가서 html 편집 단추를 누르면 skin.html과 style.css를 편집할 수 있다.
모두 영어로 쓰인 파일이 열린다. 이 파일을 편집하려면 프로그래밍 언어를 알아야 한다. 아래를 여행하면 거의 모든 걸 알 수 있다. 가끔씩 시간이 날 때마다 한두 가지 올려 보려 한다.
HTML
https://www.w3schools.com/html/
HTML Tutorial
HTML Tutorial HTML is the standard markup language for Web pages. With HTML you can create your own Website. HTML is easy to learn - You will enjoy it! Start learning HTML now » Easy Learning with HTML "Try it Yourself" With our "Try it Yourself" editor,
www.w3schools.com
에이치티엠엘(HTML)은 초 문서 표식달기 언어(HyperText Markup[1] Language)의 머릿글자를 딴 것으로 뜻한 바를 웹브라우저에 나타낼 수 있게 해주는 프로그래밍 언어이다. 에이치티엠엘 파일은 확장자 htm이나 html을 달고 있다. 보기를 들자면 아래와 같은 에이치티엠엘 문서는 바로 아래처럼 나타난다.
<!DOCTYPE html>
<html>
<head>
<title> 문서 제목 <--- 웹 브라우저 위에 나오는 제목</title>
</head>
<body>
<h1>웹 브라우저 본문에 나오는 제목</h1>
<p>여기는 문단....</p>
</body>
</html>
대부분 <tag 이름>보여주려는 내용</tag 이름>과 같은 형식으로 이루어져 있다.
바탕색이나 이미지는 background 요소에 따라 결정된다.
에이치티엠엘은 웹페이지를 만드는 표준 표식을 다는 언어다.
- HTML은 초문서 표시를 다는 언어(Hyper Text Markup Language)를 줄인 말이다.
- HTML은 표식을 달아서 웹페이지를 구성한다.
- HTML 요소는 HTML 페이지를 만든다.
- HTML 요소는 태그로 나타내어진다.
- HTML 태그 "제목", "구문", "표"와 같은 걸 표시하는 조각이다.
- 브라우저는 태그는 보여주지 않지만 태그에 따라 페이지 내용을 표현한다.
에이치티엠엘
CSS
에이치티엠엘은 여러 가지 요소를 포함하고 있는데 이것을 꾸며주는 방법이 둘이다. 하나는 같은 문서에서 스타일을 정해주는 것이고 다른 하나는 또 다른 문서로 문서로 스타일을 정해주고 이 문서를 에이치티엠엘 문서로 읽어 들이는 방법이다. 두 번째에 언급한 파일은 '한글'과 같은 워드프로세서 글꼴이나 문단 모양을 꾸미는 스타일을 따로 떼어 파일로 만들었다고 보면 된다. 이 파일은 시에스에스를 사용하여 만든다. 시에스에스는 종속된 스타일 시트(Cascading Style Sheets)의 머릿글자를 딴 것으로 티스토리 스킨에서는 파일 이름이 style.css이다. 아래에서 공부할 수 있다.
https://www.w3schools.com/css/
CSS Tutorial
CSS Tutorial CSS is the language we use to style an HTML document. CSS describes how HTML elements should be displayed. This tutorial will teach you CSS from basic to advanced. Start learning CSS now » Examples in Each Chapter This CSS tutorial contains h
www.w3schools.com
[1] 표식달기(markup) 언어는 보통 프로그래밍 언어와 달리 간단한 표식으로 문서에 있는 요소를 구별해 주는 언어를 말한다. 에이치티엠엘은 태그(tag)로 표시를 단다. 수식을 처리하는 텍($\TeX$)이나 라텍($\LaTeX$)도 표식달기 언어이다.
웹 프로그래밍 튜토리얼 | PoiemaWeb
Front-end Development Tutorial
poiemaweb.com
MDN Web Docs
MDN 웹 문서 사이트는 HTML, CSS, 및 웹 사이트와 프로그레시브 웹 앱을 위한 API를 포함한 오픈 웹 기술에 대한 정보를 제공합니다. 또한 Firefox 개발자 도구와 같은 Mozilla 제품을 위한 개발자 지향 문
developer.mozilla.org
