블로그 이미지
주로 인재개발원 등의 사이버학습을 정리, 요약하는 상시학습 블로그입니다. 깨비형
« 2017/12 »
          1 2
3 4 5 6 7 8 9
10 11 12 13 14 15 16
17 18 19 20 21 22 23
24 25 26 27 28 29 30
31            

Archive»

체험 블로그 마케팅 서비스 OLPOST

Category»

Notice»

Statistics Graph

 

'<frame>'에 해당되는 글 3

  1. 2013.02.05 15. 프레임(frame) 만들기(2)
  2. 2013.02.05 14. 프레임(frame) 만들기(1)
  3. 2013.02.04 13. 표 만들기(2)
 


1.<frame>태그의 name속성 지정하기


○ name속성 : 프레임에 이름을 붙이는 속성. 반드시 영문과 숫자의 조합으로 만들어야 하고, 이름 사이에 여백과 특수문자는 사용할 수 없다.


○ name속성 사용법


<FRAMESET rows="*,*">

<Frame src="1.html" name="top">
<Frame src="2.html" name="bottom">

</FRAMESET>



2.<frame>태그의 target속성 지정하기


 target속성

 설     명

 target="_blank"

 현재 웹 브라우저 화면은 그대로 두고, 새로운 웹 브라우저를 띄워 하이퍼링크 된 문서를 보여 줌

 target="_self"  하이퍼링크된 문서를 현재의 frame에 보여 줌(지정하지 않으면 기본값) 
 target="_parent"  현재의 문서를 가져오도록 한 이전 화면으로 돌아가 하이퍼링크된 문서를 보여 줌 
 target="_top"  frame를 무시하고 하이퍼링크된 문서를 웹 브라우저 화면 전체에 보여 줌
 target="frame이름"  frame태그의 name에서 지정한 이름이 같은 frame에 보여짐


※ 웹문서를 frame으로 나눌 때는 항상 'name'속성과 'target'속성을 지정하는 거 있지 압시다. ^^





저작자 표시 동일 조건 변경 허락
신고

'컴퓨터 활용 > 홈페이지 과정' 카테고리의 다른 글

17. 폼(form) 만들기(1)  (0) 2013.02.06
16. 인라인 프레임(iframe) 만들기  (0) 2013.02.05
15. 프레임(frame) 만들기(2)  (0) 2013.02.05
14. 프레임(frame) 만들기(1)  (0) 2013.02.05
13. 표 만들기(2)  (0) 2013.02.04
12. 표 만들기(1)  (0) 2013.02.04

1.<frame>태그의 기본형식


○ frame(프레임) : 화면(windows)를 분할 하는 것

화면을 여러 개로 나누어서 나눠진 각각의 화면에 서로 다른 웹 문서를 출력할 수 있다.

- 홈페이지 관리가 용이하며 방문객 또한 홈페이지를 편하게 구경할 수 있다.

- 화면을 분할해서 한쪽에 고정적으로 메뉴를 만들어 둘 수 있다.


○ 기본 형식

 <frameset rows="가로분할비율" cols="세로분할비율" frameborder="0" 또는 "1" >

<frame src="웹페이지 주소"> : frame의 정보지정

<frame src="웹페이지 주소"> : frame의 정보지정

 </frameset>


○ 기본 속성

속성 

 설       명

 rows

 화면을 위 아래로 나눌 때 사용하는 속성

 cols  화면을 좌 우로 나눌 때 사용하는 속성
 border

 각 프레임을 구분하는 테두리를 조절
 border를 '0'이 아닌 겂으로 지정하면 테두리 두께를 조절

 bordercolor 프레임 구분 테두리의 색상을 지정
 frameborder  프레임 구분선을 나타낼 땐 1(기본값) 그렇지 않을 땐 0


○ 사용방법

화면을 나누는 rows와 cols속성은 웹 브라우저에 표시되는 프레임의 크기와 개수를 지정할 수 있으며 프레임의 크기는 보통 픽셀(pixel)로 나타내는 절대크기와 창의 전체넓이에 대한 %로 나타내는 상대크기를 많이 사용

- 또한 프레임이 여러개인 경우 각각을 쉼표로 구별해 주면 됨.

예) <frameset rows="20%,50%,30%">이런 형식으로 작성하시면, 화면을 수평으로 3개로 나누며,100%를 기준으로 첫번째 창의 높이는 20% 중간은 50% 맨아래쪽의 창은 30%로 화면이 할당되어 나누어 진다.

- <frameset> 내에는 frame src태그를 포함시키는데, 이 frmae src는 화면에 들어갈 문서를 지정하는데 사용하며, 첫번째 자리에 있는 frame src가 첫번째 프레임 자리에 삽입되며, 두번째 자리에 있는 frmae src가 두번째 프레임 자리에 삽입

frame태그는 <body>태그 안에 적으시며 안됨. 반드시 <body>태그를 지우고 사용


※ 프레임으르 나누는 방법 세가지

① 전체 창에 대한 %비율로 나누기 

% 값을 사용하기 위해서는 1부터 100사이의 값을 사용하고 뒤에 %를 붙인다. 만약 전체 지정된 % 값이 100이상 또는 이하가 되면, 100이 되도록 균등하게 조정해 줌. 다음은 상대적인 크기를 이용하여 프레임의 크기를 지정한 예.

<FRAMESET COLS="10%,90%">

</FRAMESET> 

이것은 창을 수직으로 두개로 나누어주는 것으로 왼쪽은 전체창의 10%, 오른쪽은 전체창의 90%를 차지하게 된다. 이런경우 만약 800 ×600 해상도인 경우 왼쪽창은 80픽셀, 오른쪽 창은 720픽셀로 배정이 되고 1024 ×768 해상도인 경우 왼쪽창은 102픽셀, 오른쪽 창은 922픽셀로 배정이 된다.


 ② 픽셀 수로 지정해서 나누기 

우선 세 개의 틀을 픽셀의 개수로 지정한 예는 다음과 같다. 

<FRAMESET ROWS="100,300,240">

</FRAMESET> 

이것은 창을 수평으로 세 개로 나눈 것으로 제일 위의 창은 높이가 100픽셀, 그 다음은 300픽셀, 마지막은 240픽셀로 나누어 지도록 지정한 것임.


 ③ "*" 를 이용한 상대적인 비율로 나누기 

비율을 사용할 때에는 숫자가 있는 *와 없는 *를 사용할 수 있다. 이때에 관련된 값이 없는 *의 경우, 행이나 열 중에서 남는 부분을 모두 프레임에 할당하는 것으로 해석하면 된다. 또한 *앞에 숫자가 있는 경우는 프레임에 지정되는 상대적인 비율을 나타낸다. 예를 들어, 3*는 상대적인 값을 갖는 다른 프레임에 비하여 3배의 크기를 지정하게 된다. 예를 살펴보면, 

<FRAMESET ROWS="*, 3*">

</FRAMESET> 

이 같은 경우 두 개의 수평프레임으로 나누는데 위의 프레임과 아래의 프레임의 비율이 1:3이 되도록 할당하게 되는 것. 

<FRAMESET ROWS="100, *"> 

</FRAMESET> 

만약 위와 같이 지정하는 경우는 위의 프레임의 높이는 100픽셀로 하고 아래 프레임은 100을 뺀 나머지 전부를 할당하게 된다.



2.<frameset>태그에 삽입되는 속성


속성

설     명 

 src  프레임 안에 어떤 파일을 표시할지 지정합니다.
 noresize  프레임 경계를 마우스로 조절을 못하게 함
 scrolling="auto/yes/no"  스크롤바를 생기게 할지 정하는 속성

 (auto:자동 yes:항상 보임 no:항상 안보임)





저작자 표시 동일 조건 변경 허락
신고

'컴퓨터 활용 > 홈페이지 과정' 카테고리의 다른 글

16. 인라인 프레임(iframe) 만들기  (0) 2013.02.05
15. 프레임(frame) 만들기(2)  (0) 2013.02.05
14. 프레임(frame) 만들기(1)  (0) 2013.02.05
13. 표 만들기(2)  (0) 2013.02.04
12. 표 만들기(1)  (0) 2013.02.04
11. 사운드 태그  (0) 2013.02.03

13. 표 만들기(2)

컴퓨터 활용/홈페이지 과정 | 2013.02.04 11:11 | Posted by 깨비형

1. colspan속성, rowspan속성


○ 셀 합치기 속성 : colspan속성과 rowspan속성

colspan="가로셀 수" 셀의 수만큼 가로셀들을 하나로 병합

rowspan="세로셀 수"  : 셀의 수만큼 세로셀들을 하나로 병합


○ 기본 형식

- 칸 합치기

<td colspan="합칠 칸 수"> ... </td>
<th colspan="합칠 칸 수"> ... </th>


- 줄 합치기

<td rowspan="합칠 칸 수"> ... </td>
<th rowspan="합칠 칸 수"> ... </th>

 

○ 주의사항 : 반드시 <td>태그나 <th>태그 안에 속성으로 사용해야 한다.


   

2. 표의 외곽선 그리기 속성<frame>


○ <frame> 속성 : 표의 외곽선의 어느 부분을 보여 줄 것인지를 결정

종류

 지정값

설      명

 border  외부 테두리 전부 보임 (기본 값)
 void  외부 테두리 전부가 보이지 않음
 above  표의 위쪽 테두리만 보임
 below  표의 아래쪽 테두리만 보임
 rhs  표의 오른쪽 테두리만 보임
 lhs  표의 왼쪽 테두리만 보임
 hsides  표의 위쪽과 아래쪽 테두리만 보임
 vsides  표의 왼쪽과 오른쪽 테두리만 보임



3. 표의 내부 테두리 속성<rules>


 지정값

설      명 

 all  모든 괘선을 표시
 none  괘선을 표시 안함
 groups  그룹(THEAD,TBODY,COLGROUP)간의 경계선만 표시
 rows  가로열의 괘선만 표시
 cols  세로행의 괘선만 표시




4. <nowrap>태그


○ <nowrap>태그=>셀안의 글자의 줄 바꿈을 금지함





저작자 표시 동일 조건 변경 허락
신고

'컴퓨터 활용 > 홈페이지 과정' 카테고리의 다른 글

15. 프레임(frame) 만들기(2)  (0) 2013.02.05
14. 프레임(frame) 만들기(1)  (0) 2013.02.05
13. 표 만들기(2)  (0) 2013.02.04
12. 표 만들기(1)  (0) 2013.02.04
11. 사운드 태그  (0) 2013.02.03
10. 하이퍼링크(Link) 태그  (0) 2013.02.02