Hello, I'm Ming.

HTML 이론_기본문법, 속성, 태그 중첩, 그 외 본문

Coding/웹 애플리케이션

HTML 이론_기본문법, 속성, 태그 중첩, 그 외

#ming 2017. 6. 14. 14:37


1. HTML이란?
  웹을 위한 언어 
HyperText Markup Language => HTML
  1) HyperText - 문서와 문서 링크로 연결된 시스템
    * 링크로 연결된 여러 문서들의 복합체 = 웹
  2) Markup Language - Tag를 사용해 화면에 표시되는 형식에 대한 언어
   옷의 Tag = 옷에 대한 자세한 정보를 포함하고 있는 것
   html의 Tag = 화면에 표시되는 형식에 대한 자세한 정보 
    
    i) strong tag = 해당 내용 강조 태그
     안녕하세요. <strong>Ming</strong> 블로그에 방문해 주셔서 감사합니다.
     => 안녕하세요. Ming 블로그에 방문해 주셔서 감사합니다.
    
    <strong> 시작 태그
    </strong> 끝 태그

아래는 생활코딩에서 만든 html tag 사전이다. 
https://opentutorials.org/course/1058



2. HTML 문법 - 속성
  1) 중요한 Tag 일수록 글자가 짧다.
  2) <a>태그 = 링크 연결 태그
    <a>Ming</a> => 어디에 링크되어 있는지 표시안되어 있음
    <a>태그는 링크태그로 어디에 연결되어 있다고 표시해줘야함
    이 때 표시해주는 것을 속성이라 한다.
    <a href="Http://blog.naver.com/koreanming">Ming</a>
    속성명 = href (HyperText Reference)
    속성값 = Http://blog.naver.com/koreanming 




3) <a> 태그 링크가 새로운 창or탭에서 링크 열리게 하기 
<a href="httl://blog.naver.com/koreanming" target="_blank">Ming</a>
위의 코드에는 두 가지 속성(링크 주소 속성, 새로운 탭으로 열기 속성)이 들어가 있다.
_blank = 새로운 창 or 탭에서 열어라
_self = 현재 창 or 탭에서 열어라 
target은 잘 이해가 안간다.....
4) 속성과 속성의 구분은 띄어쓰기∨로 구분




3. 리스트 관련 Tag


위 처럼 리스트로 표시된다. 
4. 리스트 사이 간격 넣기 / 리스트 내부 순서 유무
  1) <ul> tag 리스트 사이 간격 리스트 내부 순서 없음 
ul=unordered list


2) <ol> tag 리스트 사이 간격 리스트 내부 순서 있음


5. <head> tag 문서에 대한 정보를 담고 있는 태그
  <head> 
    1) <meta charset="utf-8" /> => 이 문서는 utf-8 방식으로 저장된 문서
  </head>
    2) <title> tag => html문서의 타이틀을 지정 하는 태그
    브라우저 타이틀바에 표시 된다.



6. <body> tag 본문에 대한 내용을 표시해야 하는 태그 
  <body> 
      <ul>   
      <li>html</li> 
      <li>css</li> 
      <li>javascript</li> 
      </ul> 
  </body>

7. <html> tag
<html> </html> 안쪽에 있는 것이 html문서에 관한 내용이다를 알려주는 태그
최상위 태그(?)


8. 번외편
  1) HTML은 누가 표준을 만들까 = W3C
  2) W3C의 의장 = 팀버너스리
  3) 멤버들에 의해서 HTML은 끊임 없이 변화 중 (대표적인 멤버 apple, google, microsoft)
9. <!doctype html>
<html> 위에 적는 <!doctype html>은 문법이 아니다. 
어떤 표준에 따라서 문서가 작성되었는가 표시해주는 것


<!doctype html> = HTML5를 준수하는 HTML코드다.

10. HTML 태그를 하나씩 외울필요 없다. 어떤 태그가 있는지 알고 필요할때 찾아서 사용하면 된다.
1) Tag Reference
   Http://dev.w3.org/html5/html-author
   html5 기준 최신 tag들


생활코딩 코딩야학 2일차


'Coding > 웹 애플리케이션' 카테고리의 다른 글

개발도구/에디터 Atom 설치 및 사용법  (0) 2017.06.15
HTML 실습  (0) 2017.06.15
프로그래밍 언어란? 코딩이란?  (0) 2017.06.14
서버 제어 Bitnami 제어판 사용법  (0) 2017.06.14
윈도우에 웹서버 설치 with Bitnami  (0) 2017.06.14
공유하기 링크
'Coding/웹 애플리케이션' Related Articles more
Comments