4.HTML활용


4.2 FRAME

  browser의 창(Client Area)를 여러 개로 분리하여 작업할 수 있도록 한다. HTML 문서중에서 유일하게 BODY tag없이 사용해야하는 Tag이다. Body태그와 같이 사용하게 되면 일부 브라우저에서는 제대로 작동하지 않는 경우가 있다. (Explore 3.0에서는 아예 보여지지 않았다.)

  • 기본 문법   FRAMESET 태그가 전체 프레임을 싸고 있고, 그 아래에 FRAME 태그에 의해 하나의 영역에 대한 세부 설정이 가능하다.

    <FRAMESET ROWS="숫자 혹은 %" COLS="숫자 혹은 %“>

      <FRAME SRC="URL" NAME="name" SCROLLING="yes|no|auto">

      .............

      </FRAME>
    </FRAMESET>


      COLS, ROWS   화면을 분할해서 보여주는데, ROWS나 COLS에는 콤마분리자로 여러개로 한꺼번에 나눌 수 있다. 즉, COLS="20, 30, *"하면, 화면을 3개로 세로로 나누고, 맨 왼쪽것은 폭이 20, 가운데 것은 30픽셀, 그리고 맨 오른쪽은 그 나머지를 차지하게 구성된다. 이 이외에도 각 프레임별로 스크롤이 되거나, 여백을 설정할 수 있다.


  • 속성
      * 먼저 FRAMESET Tag에 지정할 수 있는 속성을 다음과 같다.
      ROWSFrame의 가로 분할 지정(픽셀, %, *가능)
      COLSFrame의 세로 분할 지정(픽셀, %, *가능)
      FRAMEBORDERFrame간의 경계선의 두께, 0인 경우 보이지 않는다.Netscape에서는 BORDER라는 속성으로 이를 사용한다.
      BORDERCOLOR경계선의 색상


      * FRAME Tag에 지정할 수 있는 속성을 다음과 같다.
      NAMEFrame의 이름, HREF Tag의 Target으로 지정시 사용.
      SRCFrame에 Load할 HTML문서의 URL
      SCROLLING내부에 ScrollBar생성 여부(yes, no, auto)
      NORESIZE별도의 값을 주지않고, 명시하면 Frame의 사이즈 조절 불가
      MARGINWIDTHFrame 테두리와 내용과의 좌우 여백
      MARGINHEIGHTFrame 테두리와 내용과의 상단 여백


      예제 7 : 화면을 상하로 쪼갠 예제이다. 윈도우의 메뉴와 같기 때문에 주로 사용되는 방식중의 하나이다. 상하로 쪼개진 Frame의 분리선을 상하로 조절할 수 있다.필요한 경우 자동으로 화면 스크롤이 생긴다. Frame의 경우는 HTML 소스를 보려면 메뉴에 있는 HTML 소스 보기를 선택해야하며, 각각의 Frame의 소스는 Frame소스보기를 이용해야 한다.

      예제 8 : 화면을 좌우로 쪼갠 예제이다. 인터넷의 홈페이지들중 이러한 모습을 띄고 있는 것들도 많다. 좌측에 설정된 크기로 분리선 조절이 불가능하게 하고, 분리선도 감추었다. 화면 스크롤도 허용하지 않았다.


  • Frame의 장단점

    • 장점 : 프레임의 특정한 부분만 새로 Loading하게 되므로 속도가 빨라진다.
    • 단점 : 프레임으로 나눈상태에서 브라우저의 Back, Forward버튼의 동작에 엉뚱하게 작동할 수 있다. 실제 Portal사이틀을 보면, 거의 Frame을 쓰지 않는 다는 점을 알 수 있을 것이다.
    HREF Target   보통 Link의 경우는 현재의 화면에 Link화면을 출력하는데, Frame의 경우 현재 자신의 위치가 아닌 다른 Frame에 출력하고 싶다면, name을 지정하여 link시에 다음과 같이 TARGET을 설정하면 된다.

      <A HREF SRC="mn.html" TARGET="name">name</A>

    TARGET에다가 현재의 Frame들중 동일한 이름을 가진 Frame이 존재하지 않는 경우에는 새로운 윈도우가 열리게 된다.
  * 다음은 Href의 Target으로 기 지정된(reserved) 것들이다.
  • _top : 현재 보는 브라우저의 최상위 Frame이 대상이 된다.
  • _blank : 새로운 브라우저를 띄우고 이를 대상으로 한다.
  • _selt : 현재 자기 자신의 Frame이 대상이 된다.
  • _parent : 한단계 위의 Frame이 대상이 된다.

- Last Update : 2001.6.19 by Deadfire(http://www.deadfire.net)

HTML 강좌
HTML이란?
웹서버 작동원리
HTML 기초
     - 전체 구조
     - 기본 태그
     - 속성 추가
     - Link/Anchor
     - 목록 Tag
     - 문자와 스타일
     - 기타 Tag
     - 특수 문자 표기
     - 이미지 표기
HTML 활용
     - Table
     - Frame
     - Form
     - Elements
기 타
     - MIME Type
     - 이미지 맵
     - 클라이언트 풀
마치며

Copyright ⓒ 1997 ~, Deadfire Program Master