• S. 사이드바
  • H. 홈으로
  • F. 검색
  • C. 댓글
  • T. 태그
  • G. 방명록
  • N. 공지사항
  • W. 글쓰기
  • A. 관리자
  • O. 로그아웃
HTML / CSS문법을 참고한 사이트 - w3schools
2011. 10. 14. 06:30 블로그 (티스토리)
Google Ads
블로그스킨을 변경하면서 알게된 것들. (html, css, 워드프레스등)에 계속되는 글입니다.

티스토리 블로그스킨을 변경하면서 제일 많이 손대는 것이 아래의 두 파일일 겁니다.
1. skin.html
2. style.css

html파일과 css파일의 관계는 위키백과의 발췌로 대체합니다.
HTML은 하이퍼텍스트 마크업 언어(HyperText Markup Language, 문화어: 초본문표식달기언어, 하이퍼본문표식달기언어)라는 의미의 웹 페이지를 위한 지배적인 마크업 언어다. HTML은 제목, 단락, 목록 등과 같은 본문을 위한 구조적 의미를 나타내는 것뿐만 아니라 링크, 인용과 그 밖의 항목으로 구조적 문서를 만들 수 있는 방법을 제공한다. 그리고 이미지와 객체를 내장하고 대화형 양식을 생성하는 데 사용될 수 있다. HTML은 웹 페이지 콘텐츠 안의 꺾쇠 괄호에 둘러싸인 "태그"로 되어있는 HTML 요소 형태로 작성한다. HTML은 웹 브라우저와 같은 HTML 처리 장치의 행동에 영향을 주는 자바스크립트와 본문과 그 밖의 항목의 외관과 배치를 정의하는 CSS 같은 스크립트를 포함하거나 불러올 수 있다. HTML과 CSS 표준의 공동 책임자인 W3C는 명확하고 표상적인 마크업을 위하여 CSS의 사용을 권장한다.

skin.html과 style.css파일을 수정하면서 가장 벽에 부딫치는 것은 역시 html과 css의 사용법 즉, 문법인데 이것을 쉽게 풀이 해 놓았고 바로 쉽게 확인할 수 있게 해주는 사이트가 있어서 소개합니다.
w3schools 라는 영문사이트입니다.
Google번역으로 번역된 링크


01    w3schools의 사용방법
▼ 사용하는 방법은 간단합니다. 검색하고 싶은 태그의 명등으로 검색을 합니다.



▼ 검색을 하면 구글검색으로 검색결과가 나타납니다.
    CSS + " 검색어" 를 클릭합니다.


▼ 태그의 기능에 대한 설명과 세부설정에 대한 설명들이 아래로 쭈욱~ 나옵니다.



▼ 눈여겨 볼 곳은 아래의 "Try it yourself"라는 곳입니다.


▼ "Try it yourself"라는 곳을 클릭하면 태그를 테스트 할 수 있는 화면이 나옵니다.

    수정하고 싶은 곳을 수정 한 후 "Edit and Click Me"를 클릭하면 오른쪽화면에 결과가 보여 집니다.



02    w3schools가 좋은 점 또 하나...
예로 background-color는 #F0F8FF처럼 색상코드을 지정하여 배경화면의 색상을 지정하는 역활을 합니다. 고민거리는 색상코드를 모르다는 겁니다. 색상코드를 조사할려면 인터넷에서 다시 검색을 하여야 합니다만 w3schools는 "background-color는 이런 속성입니다."라는 설명과 함께 "이곳도 참고하세요"라며 친절하게 링크를 걸어 놓아서 그런 수고를 덜어 줍니다.
즉, 관련된 정보를 알기 쉽게 링크를 해 놓아서 쉽게 관련정보에 접근을 할 수 있습니다.


Google Ads
Google Ads