본문 바로가기
IT/IT,인터넷

티스토리의 Skin.html과 Style.css 초보1편 html이란?

by 하루린 2014. 6. 12.
반응형

나도 나의 홈페이지를 만들어보고 싶어서 그리고 어떻게 하다가 보니간 티스토리의 초대장을 한번만에 받게 되어서 이렇게 티스토리를 개설을 하였지만 뭐냐 알수가 있어야죠...HTML아!!!!!.... 뭐라고 하는건지 알수도 없고 뭐라고 이야기하는건지 알지도 못하겠고 그래서 생각난 건 간단한 SKIN을 받아서 사용하자라고 생각한것.. 그러나 이건 내가 좋아하는 모양도 아니구 이거 답답도 하고, 그래서 "안되겠다" 한번 내가 홈페이지공부를 해보자 생각을 하게 되어서 이렇게 자료도 남기고 하는김에 HTML도 공부를 해보고 해서 이렇게 글을 작성하게 되었네요....

 

자 그럼 HTML이란 무엇인가부터 알아보도록 하겠습니다.

HTML이란 Hypertext Markup Language 라는 뜻을 줄인말인데 web사이트를 만들기 위해 개발된 프로그래밍 언어의 한 종류, 주로 홈페이지를 작성하는데 사용되는 프로그래밍언어로써 그 명령어는 글자크기, 글자색, 글자모양, 그래픽, 문서이동(하이퍼링크) 등을 정의한다.

저도 잘 모르지만 초보를 탈출한다는 생각으로 한개씩 만들어가면 나도 초보를 탈출하라라 생각하고 한개씩 한개식 만들어 나가볼려고 한다. 지금 티스토리자체에 있는 기본적인 모양들은 내가 생각하는 그런 모양이 나오지 않고 필자의 마음에 그렇게 드는 것이 아니기에 좀더 좋은 웹사이트로 만들어볼까 하는 생각으로 이렇게 자료를 남겨놓으면 나중에라도 한번 보면 알수 있게 해 볼려고 한다.

 

언제나처럼 이것은 준비도구는 그렇게 많지가 않아요.. wordpad,notepad,textedit 그리고 각종 HTML편집기

 

</head>
<body id="tt-body-page">
<s_t3>
 <div id="header">
  <div class="head-container">
    <!-- 블로그제목 -->
    <h1><a href="https://halulin.tistory.com/" title="하루린의 세상사는 조그만한 이야기">하루린의 세상사는 조그만한 이야기</a></h1>
    <!-- 블로그메뉴 -->
    <div id="blogMenu">

</div>
    <div id="searchbar">
     <div class="searchbar-left"></div>
     <div class="searchbar-container">
      <!-- 검색 모듈 -->

 

위에 보시는 문서가 바로 알고 있는 HTML이다.

자 그럼 간단하게 대충 뭐가 있는지 부터 알아보고 다음 단계인 각각의 태그로 넘어가보도록 하겠습니다.

먼저 아래의 간단한 태그를 보도록 하겠다

 

<html>

  <head>

    <title>

    </title>

  </head>

  <boby>

  </boby>

</html>

 

위의 웨문서를 보면 <html>이 있고 맨 밑에 보면 다시 비슷한 문장인 </html>이 있을것이다. 앞에 "/"가 있는건 그 단락을 끝난다는 의미이다. 그러니깐 <?????>는 시작이라는 의미고 </?????>는 끝난다는 말이다. 문장에 "."를 넣는것고 같은 의미로 보시면 된다.

 

자 그럼 각 태그의 뜻을 알아보도록 하자. 간단하게 하고 넘어가고 다음편에 생세하게 해 보겠다.

 

<html> </html> : 그 web문서의 시작과 끝이다.

<head> </head> : 보통웹문서의 맨 위의 자리에 있는것으로 머리부분이라고 하죠.

<title> </title> : 그 머리부분에 있는 본인의 웹사이트이름

<boby> </boby> : 그리고 이부분은 본문부분이죠.

 

오늘은 정말로 간단하게 저도 알고 있는 것을 올려보았습니다. 이제 좀더 심도 있는 작업도 같이 할거이면 이것을 병행하면서 style.css도 같이 공부를 해보도록 하겠다. 이 style.css는 는 Html에서 하지 못하는 글자나 배경색 기타 스타일을 만들어주는 파일이며 이것을 하게 되면 웹페이지가 좀 더 화려하게 보인다.

 

아차 하나 빠질뻔한 것이 있다. 위의 표는 절대로 바뀌지 않는 형식이라고 보시면 된다. 저 양식이 가장 큰 테두리고 그 안에 들어가는 새새한것이 있다고 보시면 된다.

반응형