HTML 영역 관련 태그

Jieun·2023년 2월 12일

📝 표, 영역, 이미지, 하이퍼링크, 입력 관련 태그 배우기
#230209

🏷️영역을 나누는 형식(성질)

1. black 형식

  • 수직으로 되어있는 화면을 가로로 잘라서 여러 행을 만드는 것

  • 크기를 지정하는 width, height 속성을 사용 할 수 있음. (O)

   ex) p/pre(문단 나누기), h1~h6(제목 영역 나누기), hr(수평선 넣어서 화면 나누기), div(영역 나누기)

2. inline 형식

  • 공간을 수평 분할
  • 수평으로 되어있는 화면을 세로로 잘라서 여러 열(컬럼)을 만드는 것
  • 크기를 지정하는 width, height 속성을 사용 할 수 없음. (X)

   ex) strong/b (글자를 굵게), em/i (글자 기울이기), mark(형광펜), span(한줄을 나누는 용도)


🏷️ block(div) / inline(span) 차이점

1. 줄바꿈(개행)

div : block 형식의 태그는 한 줄을 모두 차지하기 때문에,
         뒤에 오는 내용은 다음 줄에 작성이 된다.

span : inline 형식 태그는 한 줄 내에서 일정한 칸(열)을 차지하기 때문에
          뒤에 오는 내용은 줄이 바뀌지 않고 옆에 붙는다.

2. 영역 지정 방식
block: 사각형 박스 형태로 영역을 지정
inline : 내부에 작성된 내용(Content)단위로 영역을 지정

3. 크기 지정 (width/height)
block : 크기 지정 가능(o)
inline : 크기 지정 불가능(x)

iframe : 웹 문서 내부에 다른 웹문서를 추가하는 태그
              (inline 형식이지만, 크기지정 가능)

    
profile
👩‍💼👩‍💼➡️➡️➡️👩‍💻👩‍💻 생산자의 삶을 살기 위해 개발공부중

0개의 댓글