block 요소, inline 요소, 블록 요소, 인라인 요소

(2019-05-13)

inline-block 요소, 인라인 블록 요소, CSS display, disply 속성, visibility 속성

1. html 태그별 보이기 유형( block,inline) 구분

  ㅇ block 요소   ☞ CSS 박스 모델 참조
     - 특징 : 줄바꿈 있음, 
               width,height 속성 적용 가능, margin,padding 상하 속성 적용 가능
     - 종류 : h 요소, p 요소, header 요소, section 요소, main 요소, aside 요소,
              footer 요소, div 요소, pre 요소, ol 요소, ul 요소, form 요소, hr 요소,
              table 요소 등

  ㅇ inline 요소
     - 특징 : 줄바꿈 없음, 
              width,height 속성 적용 불가능, margin,padding 상하 속성 적용 불가능
     - 종류 : a 요소, abbr 요소, b 요소, bdi 요소, bdo 요소, br 요소, cite 요소, code 요소,
              data 요소, del 요소, dfn 요소, em 요소, i 요소, 
              img 요소, input 요소, span 요소, time 요소 등


2. 보이기 유형의 재지정

  ㅇ { display : 값; } : 값에 따라 요소에 다양한 표현 유형 효과를 달리 지정 가능
     * (값 : display : inherit 기본값, inline, block, inline-block, none, list-item)
     - inherit : (기본값) 요소 부모로부터 상속 받은 display 속성
     - block   : 요소를 박스화시켜,
        . 위아래에 줄바꿈이 일어나도록 함
        . width,height 속성 및 margin,padding 상하 속성 적용 가능
     - inline  : 요소들을 같은 줄에 표시함으로써,
        . 폭,높이 및 상하 여백 조정 불가
     - inline-block : 요소들을 같은 줄에 표시하되,
        . 폭,높이 및 상하 여백 조정이 가능토록 함
     - none    : 요소가 페이지에서 완전히 사라지도록 함

ㅇ { visibility : 값; } : 값에 따라 화면 표시 여부 지정
   * (값 : visibility : visible 기본값, hidden, collapse)
   - visibility는 display:none과 달리, 
      . block 박스는 살아있고, 그 내용 만 보이기/숨김 임


[CSS] 1. CSS 2. CSS 선택자 3. CSS 박스 모델 4. block,inline 요소 유형 5. CSS 속성 값 6. CSS 배경 7. CSS 색상 8. CSS 위치 레이아웃 9. CSS 정렬 10. CSS 텍스트
  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.   마크업 언어
            2.   DOM,BOM
            3.   기능 요소
            4.   웹 디자인
                  1. 웹 디자인
                  2. 스타일 시트
              1.   CSS
                1.   1. CSS
                    2. CSS 선택자
                    3. CSS 박스 모델
                    4. block,inline 요소 유형
                    5. CSS 속성 값
                    6. CSS 배경
                    7. CSS 색상
                    8. CSS 위치 레이아웃
                    9. CSS 정렬
                    10. CSS 텍스트
          4.   웹 식별
          5.   웹 서비스
          6.   차세대 웹
          7.   웹기술 기타일반
        8.   VPN
        9.   무선인터넷
        10.   전자상거래
        11.   개인 컨텐츠
        12.   인터넷 기타 응용
      9.   인터넷 기타
      10.   패킷교환(PSN)
      11.   인터넷 관련 기관
  7.   정보기술(IT)
  8.   공업일반(기계,재료등)
  9.   표준/계측/품질
  10.   기술경영

 
        최근수정     요약목록     참고문헌