기록공간

HTML 간단 정리 본문

FrontEnd/HTML

HTML 간단 정리

입코딩 2020. 11. 8. 15:13
반응형

HTML

○ HTML → Hypter Text Marup Language

 

○ Hyper Text : Link

 

○ 전용 브라우저(Internet Explorer, Opera, FireFox, Chrome, Safari, ...)

 

○ 프로그램 + 실행환경(실행기)

 

○ 일반 문서 편집기

    - 완성형 아스키(ASCII) 방식

    - Notepad, Editplus, Homesite 등...

 

○ HTML 전용 에디터

    - WYSIWYG(What You See Is What You Get)

    - 여러 작업을 기능화시킨 전용 에디터

    - 나모 웹 에디터, 드림위버 등...

 

○ HTML 특징

    - 태그는 대소문자 구분이 없다. (하지만 소문자를 권장함)

    - 확장자는 html 또는 htm 으로 만든다.

    - 엔터, 스페이스바, 탭은 허용하지 않는다. 

        → 전용 줄바꿈 요소 사용

    - 태그의 중첩 관계를 지켜야 한다.

    - 파일명 또는 디렉터리명(경로명)은 영문으로 사용한다.

    - 파일명 또는 디렉터리명에 공백을 제외한다.

 

HTML 구성요소

○ 태그(Tag)

    - 『 < 』 와 『 > 』 로 묶인 HTML 명령어

    - <시작태그> ... </끝태그>

    - <단독태그> 또는 <단독태그/>

        (보통 xhtml, 옛날 사람들의 습관으로 씀, 권장하지 않는 방법)

 

○ 요소(Elements)

    - 태그에 의해 정의된다.

    - <h3> 열심히 공부하자 </h3>

 

○ 속성(Attributes)

    - 시작 태그가 가지는 특성

    - 없거나 여러개 기술 가능

    - 지정된 범위의 값을 가진다.

    - <태그명 속성명="속성값"> ... </태그명>

 

○ 값(value)

    - 속성에 대한 값

    - 속성명="속성값", 속성명="속성값" ...

 

HTML 문서의 기본 골격

<html>
            <head> ... </head>
            <body> ... </body>
</html>

○ <html> ... </html>

    - 문서의 시작과 끝

 

○ <head> ... </head>

    - HTML 파일의 각종 정보를 담는 영역

    - 미 출력 부분 ... info 부분

 

○ <body> ... </body>

    - 웹 브라우저 화면에 출려되는 영역

 

○ <title> ... </title>

    - 문서의 제목을 나타내는 태그

반응형
저작자표시 (새창열림)

'FrontEnd > HTML' 카테고리의 다른 글

시맨틱 태그(Semantic Tag)  (0) 2021.04.12
'FrontEnd/HTML' Related Articles more
Comments