HTML 기타 요소

(2018-09-08)

img 요소

1. html 요소 또는 문서 요소웹문서의 시작과 끝을 나타냄 : <html lang='ko'> ... </html>속성 : lang='국가언어명'
     - (de: 독일어, en: 영어, kr: 한국어, zh: 중국어 등) ISO 639-1 (Language Code)


2. 이미지 (image) 요소웹페이지 이미지 구현 방법 둘
     - `인라인(inline) 형태인 img 요소의 삽입`, `CSS 형태의 배경 이미지`

  ㅇ img 요소
     * 웹페이지에 `img 요소` 및 `src, alt, width, height 속성`으로 이미지 표현 방법

     - 속성 : (필수) src, alt, (선택) width, height 등
     - 이미지 파일 경로 : src 속성 이용
     - 가능한 이미지 파일 형식 : GIF, JPEG, PNG 
     - 이미지 대체 텍스트 지정 : alt 속성 이용
     - 화면상 이미지 위치 : 기본적으로 텍스트 하단 기준선에 맞춰 정렬됨
     - 화면상 이미지 주변 : 이미지 주변의 텍스트,공백,경계선 등의 조절은 CSS 스타일을 이용
     - 다른 이미지 적용 : 장치 크기에 따라 다른 이미지를 적용하려면 자바스크립트 등을 활용


3. 목록 요소

  ㅇ 종류
     - 순서 없는 목록 : ul 요소
     - 순서 있는 목록 : ol 요소
     - 정의형 목록    : dl 요소 
        . 용어(term)와 설명(description) 2개 부분으로 구성됨

  ㅇ li 요소 (List Item)
     - 목록 개별 항목을 나타내는 요소


4. p 요소 (Paragraph)

  ㅇ 같은 주제를 전달하는 문장들을 함께 묶는 요소 (단락)
     - P 요소는 P 마크업된 곳의 앞,뒤에 항상 여백의 공간을 둠


5. 논리적인 구획 구분을 위한 요소

  ㅇ 레이아웃에 의미적인(Semantic) 마크업을 적용하려는 섹셔닝(Sectioning) 요소들
     - 웹페이지 전체 또는 일정 영역을 논리적인 구획으로 분할할 때 유용한 요소들
     - 종류 : header, nav, section, article, aside, footer

  ㅇ 개략적인 구획 例)
        

  ㅇ section 요소
     - 장이나 절을 구분시킴

  ㅇ aside 요소 
     - 본문 내용 중에 추가 설명 또는 분리된 컨텐츠 표현이 필요할 때,
       통상 사이드바 영역으로 표시하는데 유용


6. meta 요소 (Metadata)

  ㅇ 문서 정보웹브라우저에게 제공키 위한 요소 (문서 자체를 설명)
     - HEAD 요소 내에 위치함
        . (어떤 내용인지/핵심 키워드/작성자/문자세트 등)


7. blockquote 요소 (Block Quotation)

  ㅇ 블록 형태의 인용문을 나타내는 요소
     - P 요소 처럼 별도 단락으로 표시됨
        . 양쪽 들여쓰기가 적용되어 다른 것들과 확연히 구분되게 함
        . 추가적으로 서식을 맞추는 것이 금지됨


8. object 요소, embed 요소

  ㅇ 과거 웹브라우저가 직접 보여주지 못했던 컨텐츠를, 
     플러그인을 통해 가능토록 웹브라우저 기능 확장용 요소


9. iframe 요소

  ㅇ 브라우저 내에 또다른 소형 브라우저를 구현하는 방식
     - 나머지 다른 컨텐츠들에 영향을 미치지 않도록 분리 구현코자 할 때 주로 사용
        . iframe 요소를 이용하면 웹페이지 내 별도 HTML 문서 또는 다른 컨텐츠의 삽입 가능


10. Link 요소

  ㅇ 다른 문서를 참조하는 a 요소와는 달리, 외부 소스를 연결하여 현재 문서의 효과적 처리
     - 사용 例) 현재 문서의 번역 버전의 제공, 현재 문서의 스타일시트 적용 등


11. Video 요소플러그인 라이브러리 사용 없이도 웹브라우저 자체 내장 기능 만으로
     비디오를 볼 수 있게하는 요소


12. Canvas 요소웹페이지 내에 자바스크립트프로그램이 가능한 그림 화폭


[HTML 요소] 1. HTML 구성 요소 2. A 요소 3. Form 요소 4. HTML 기타 요소
  1.   기술공통
  2.   기초과학
  3.   진동/파동
  4.   방송/멀티미디어/정보이론
  5.   전기전자공학
  6.   통신/네트워킹
        1. 통신 이란?
        2. 신뢰적 통신
    1.   통신이론
    2.   선로/전송
    3.   통신망 일반
    4.   회선교환(PSTN)
    5.   무선/이동통신
    6.   광통신
    7.   인터넷/데이터통신
          1. 데이터통신망
          2. 인터넷
          3. 데이터 네트워크 설계
      1.   데이터 단위
      2.   프로토콜/계층
      3.   데이터 링크
      4.   TCP/IP
      5.   라우팅
      6.   인터넷 QoS
      7.   인터넷 관리
      8.   인터넷 응용
        1.   NetBIOS
        2.   DNS
        3.   가상단말
        4.   FTP
        5.   전자메일
        6.   VoIP
        7.   웹기술
              1. 웹 이란?
              2. 하이퍼텍스트
          1.   웹 구성
          2.   HTTP
          3.   웹 페이지
            1.   마크업 언어
                  1. 마크업 언어
                  2. SGML
                  3. DTD
              1.   HTML
                    1. HTML
                    2. HTML 용어
                    3. DHTML
                    4. HTML5
                1.   HTML 요소
                  1.   1. HTML 구성 요소
                      2. A 요소
                      3. Form 요소
                      4. HTML 기타 요소
              2.   XML
            2.   스크립트 언어
            3.   DOM,BOM
            4.   기능 요소
            5.   웹 디자인
          4.   웹 식별
          5.   웹 서비스
          6.   차세대 웹
          7.   웹기술 기타일반
        8.   VPN
        9.   무선인터넷
        10.   전자상거래
        11.   개인 컨텐츠
        12.   인터넷 기타 응용
      9.   인터넷 기타
      10.   패킷교환(PSN)
      11.   인터넷 관련 기관
  7.   정보기술(IT)
  8.   공업일반(기계,재료등)
  9.   표준/계측/품질
  10.   기술경영

 
        최근수정     요약목록(시험중)     참고문헌