frame 나누기

태그에 대해서 한번 배워볼까요?

frame 나누기

쿠욱키 2005. 10. 29. 18:36

프레임은 화면을 쪼개주는 역할을 합니다~! 프레임을 만들어야...화면을 알맞게 쪼개서 정당한 홈페이지를 만들수 있습니다. 물론 하나의 웹페이지로도 홈페이지 만드는건 가능하지만... 대부분 한 화면을 알맞게 쪼개서...홈페이지를 마니 만들죠...저도...2개의 프레임으로 나눠서 홈페이지를 구성했슴미돠...^^;;
<frame> 태그는 프레임을 만드는 태그로서 <frameset> 태그 내에서만 사용됩니다. 하나의 프레임에는 하나의 홈페이지가 필요하죠~!! 이게 무슨 말이냐면... <frame>은..그냥 화면만 쪼개준검미돠...이 쪼개준 화면에..어떤 웹페이지로 채워넣어야 한다는 말이죠~!!

frame 속성	설명
src="웹페이지파일"	·나누어진 화면에 불러올 웹페이지 지정
border=n	·프레임 경계선의 두께를 설정. ·입력값을 0으로 하면 경계선 사라짐 ·n은 두께(픽셀단위~!)
bordercolor="색명/RGB코드값"	·프레임 경계선의 색상 지정
frameborder="n"	·프레임 경계선의 표시 유무를 판단 ·입력값 1 => 경계선 유, 입력값 0 => 경계선 무
Marginheight="n"	·프레임의 상하 여백을 설정. ·n은 상하 여백(픽셀단위~!)
Marginwidth="n"	·프레임의 좌우 여백을 설정. ·n은 좌우 여백(픽셀단위~!)
Name="프레임이름"	·프레임의 이름을 지정함. ·프레임 이름은 중요한 역할을 함. ·이름을 지정하여 이벤트일어날 자리를 지정함 ·"_new", "_top", "_blank"등은 예약어 이기 때문에 이름으로 사용할수 없음.
noresize	·프레임 경계를 마우스로 조절 못하게 함.
scrolling="Auto/Yes/No"	·프레임 내에 스크롤바를 나태낼것인지 정함. ·Auto : 자동, Yes : 스크롤바 유, No: 스크롤바 무

frameset 속성	설명
border=n	·프레임셋 내에서 프레임들의 경계선의 두께를 설정. ·입력값을 0으로 하면 경계선 사라짐 ·n은 두께(픽셀단위~!)
bordercolor="색명/RGB코드값"	·프레임셋 내의 경계선의 색상 지정
frameborder="n"	·프레임 경계선의 표시 유무를 판단 ·입력값 1 => 경계선 유, 입력값 0 => 경계선 무
framespacing="n"	·프레임 셋 내에서 프레임들간의 간격 설정. ·n은 프레임 간격(픽셀단위~!)
cols="n"	·프레임 셋 내의 프레임들을 수직으로 나누고자 할때, 각 프레임의 너비 설정 ·n은 프레임너비(픽셀단위~!)
rows="n"	·프레임 셋 내의 프레임들을 수평으로 나누고자 할때, 각 프레임의 너비 설정 ·n은 프레임너비(픽셀단위~!)

형식은 이렇게 됩니다...<frameset row="가로분할비율" 또는 cols="세로분할비율"> <frame src="불러낼 웹페이지 주소 또는 웹페이지 파일"> <frame src="불러낼 웹페이지 주소 또는 웹페이지 파일"> </frameset> 그럼..어떻게 프레임이 나뉘는지 한번 살펴보져~!! ^^;;

Tag

<html> <head> <script type="text/javascript">if (!window.T) { window.T = {} } window.T.config = {"TOP_SSL_URL":"https://www.tistory.com","PREVIEW":false,"ROLE":"guest","PREV_PAGE":"","NEXT_PAGE":"","BLOG":{"id":5625759,"name":"pshto","title":"Happy Everyday","isDormancy":false,"nickName":"쿠욱키","status":"open","profileStatus":"normal"},"NEED_COMMENT_LOGIN":false,"COMMENT_LOGIN_CONFIRM_MESSAGE":"","LOGIN_URL":"https://www.tistory.com/auth/login/?redirectUrl=https://pshto.tistory.com/m/4875397","DEFAULT_URL":"https://pshto.tistory.com","USER":{"name":null,"homepage":null,"id":0,"profileImage":null},"SUBSCRIPTION":{"status":"none","isConnected":false,"isPending":false,"isWait":false,"isProcessing":false,"isNone":true},"IS_LOGIN":false,"HAS_BLOG":false,"IS_SUPPORT":false,"IS_SCRAPABLE":false,"TOP_URL":"http://www.tistory.com","JOIN_URL":"https://www.tistory.com/member/join","PHASE":"prod","ROLE_GROUP":"visitor"}; window.T.entryInfo = {"entryId":4875397,"isAuthor":false,"categoryId":1191931,"categoryLabel":"태그에 대해서 한번 배워볼까요?"}; window.appInfo = {"domain":"tistory.com","topUrl":"https://www.tistory.com","loginUrl":"https://www.tistory.com/auth/login","logoutUrl":"https://www.tistory.com/auth/logout"}; window.initData = {}; window.TistoryBlog = { basePath: "/m", url: "https://pshto.tistory.com", tistoryUrl: "https://pshto.tistory.com", manageUrl: "https://pshto.tistory.com/manage", token: "23PW9ucrs+SxkJW2ZrlDR+F0GrKPRAzl8JLFpQOzOquQktxrrMporeaUkA35I0YS" }; var servicePath = ""; var blogURL = "";window.T.gnbContext = {"userId":0,"userName":"","profileSrc":"https://t1.daumcdn.net/tistory_admin/blog/admin/profile_default_03.png","storyServiceURI":{"storyHome":"https://storyhome.kakao.com/","brunchStory":"https://brunch.co.kr/","kakaoStory":"https://story.kakao.com/"},"blogs":[],"tryAutoLogin":false};</script> <link rel="stylesheet" type="text/css" href="https://tistory1.daumcdn.net/tistory_admin/userblog/userblog-5da7c081e816003d82680aa120bef6fa380b0a24/static/style/revenue.css"/> <link rel="canonical" href="https://pshto.tistory.com/4875397"/>  <script type="application/ld+json"> {"@context":"http://schema.org","@type":"BlogPosting","mainEntityOfPage":{"@id":"https://pshto.tistory.com/m/4875397","name":null},"url":"https://pshto.tistory.com/m/4875397","headline":"frame 나누기","description":"프레임은 화면을 쪼개주는 역할을 합니다~! 프레임을 만들어야...화면을 알맞게 쪼개서 정당한 홈페이지를 만들수 있습니다. 물론 하나의 웹페이지로도 홈페이지 만드는건 가능하지만... 대부분 한 화면을 알맞게 쪼개서...홈페이지를 마니 만들죠...저도...2개의 프레임으로 나눠서 홈페이지를 구성했..","author":{"@type":"Person","name":"쿠욱키","logo":null},"image":{"@type":"ImageObject","url":"https://img1.daumcdn.net/thumb/R800x0/?scode=mtistory2&fname=https%3A%2F%2Ft1.daumcdn.net%2Ftistory_admin%2Fstatic%2Fimages%2FopenGraph%2Fopengraph.png","width":"800px","height":"800px"},"datePublished":"2005-10-29T18:36:57+09:00","dateModified":"2005-10-29T18:36:57+09:00","publisher":{"@type":"Organization","name":"TISTORY","logo":{"@type":"ImageObject","url":"https://t1.daumcdn.net/tistory_admin/static/images/openGraph/opengraph.png","width":"800px","height":"800px"}}} </script>  </head> <frameset cols="20%, 80%" frameborder="1"> <frame src=""> <frame src=""> </frameset> </html>

실행결과

Tag

<html> <head> <script type="text/javascript">if (!window.T) { window.T = {} } window.T.config = {"TOP_SSL_URL":"https://www.tistory.com","PREVIEW":false,"ROLE":"guest","PREV_PAGE":"","NEXT_PAGE":"","BLOG":{"id":5625759,"name":"pshto","title":"Happy Everyday","isDormancy":false,"nickName":"쿠욱키","status":"open","profileStatus":"normal"},"NEED_COMMENT_LOGIN":false,"COMMENT_LOGIN_CONFIRM_MESSAGE":"","LOGIN_URL":"https://www.tistory.com/auth/login/?redirectUrl=https://pshto.tistory.com/m/4875397","DEFAULT_URL":"https://pshto.tistory.com","USER":{"name":null,"homepage":null,"id":0,"profileImage":null},"SUBSCRIPTION":{"status":"none","isConnected":false,"isPending":false,"isWait":false,"isProcessing":false,"isNone":true},"IS_LOGIN":false,"HAS_BLOG":false,"IS_SUPPORT":false,"IS_SCRAPABLE":false,"TOP_URL":"http://www.tistory.com","JOIN_URL":"https://www.tistory.com/member/join","PHASE":"prod","ROLE_GROUP":"visitor"}; window.T.entryInfo = {"entryId":4875397,"isAuthor":false,"categoryId":1191931,"categoryLabel":"태그에 대해서 한번 배워볼까요?"}; window.appInfo = {"domain":"tistory.com","topUrl":"https://www.tistory.com","loginUrl":"https://www.tistory.com/auth/login","logoutUrl":"https://www.tistory.com/auth/logout"}; window.initData = {}; window.TistoryBlog = { basePath: "/m", url: "https://pshto.tistory.com", tistoryUrl: "https://pshto.tistory.com", manageUrl: "https://pshto.tistory.com/manage", token: "23PW9ucrs+SxkJW2ZrlDR+F0GrKPRAzl8JLFpQOzOquQktxrrMporeaUkA35I0YS" }; var servicePath = ""; var blogURL = "";window.T.gnbContext = {"userId":0,"userName":"","profileSrc":"https://t1.daumcdn.net/tistory_admin/blog/admin/profile_default_03.png","storyServiceURI":{"storyHome":"https://storyhome.kakao.com/","brunchStory":"https://brunch.co.kr/","kakaoStory":"https://story.kakao.com/"},"blogs":[],"tryAutoLogin":false};</script> <link rel="stylesheet" type="text/css" href="https://tistory1.daumcdn.net/tistory_admin/userblog/userblog-5da7c081e816003d82680aa120bef6fa380b0a24/static/style/revenue.css"/> <link rel="canonical" href="https://pshto.tistory.com/4875397"/>  <script type="application/ld+json"> {"@context":"http://schema.org","@type":"BlogPosting","mainEntityOfPage":{"@id":"https://pshto.tistory.com/m/4875397","name":null},"url":"https://pshto.tistory.com/m/4875397","headline":"frame 나누기","description":"프레임은 화면을 쪼개주는 역할을 합니다~! 프레임을 만들어야...화면을 알맞게 쪼개서 정당한 홈페이지를 만들수 있습니다. 물론 하나의 웹페이지로도 홈페이지 만드는건 가능하지만... 대부분 한 화면을 알맞게 쪼개서...홈페이지를 마니 만들죠...저도...2개의 프레임으로 나눠서 홈페이지를 구성했..","author":{"@type":"Person","name":"쿠욱키","logo":null},"image":{"@type":"ImageObject","url":"https://img1.daumcdn.net/thumb/R800x0/?scode=mtistory2&fname=https%3A%2F%2Ft1.daumcdn.net%2Ftistory_admin%2Fstatic%2Fimages%2FopenGraph%2Fopengraph.png","width":"800px","height":"800px"},"datePublished":"2005-10-29T18:36:57+09:00","dateModified":"2005-10-29T18:36:57+09:00","publisher":{"@type":"Organization","name":"TISTORY","logo":{"@type":"ImageObject","url":"https://t1.daumcdn.net/tistory_admin/static/images/openGraph/opengraph.png","width":"800px","height":"800px"}}} </script>  </head> <frameset rows="20%, 80%" frameborder="1"> <frame src=""> <frame src=""> </frameset> </html>

실행결과

Tag

<html> <head> <script type="text/javascript">if (!window.T) { window.T = {} } window.T.config = {"TOP_SSL_URL":"https://www.tistory.com","PREVIEW":false,"ROLE":"guest","PREV_PAGE":"","NEXT_PAGE":"","BLOG":{"id":5625759,"name":"pshto","title":"Happy Everyday","isDormancy":false,"nickName":"쿠욱키","status":"open","profileStatus":"normal"},"NEED_COMMENT_LOGIN":false,"COMMENT_LOGIN_CONFIRM_MESSAGE":"","LOGIN_URL":"https://www.tistory.com/auth/login/?redirectUrl=https://pshto.tistory.com/m/4875397","DEFAULT_URL":"https://pshto.tistory.com","USER":{"name":null,"homepage":null,"id":0,"profileImage":null},"SUBSCRIPTION":{"status":"none","isConnected":false,"isPending":false,"isWait":false,"isProcessing":false,"isNone":true},"IS_LOGIN":false,"HAS_BLOG":false,"IS_SUPPORT":false,"IS_SCRAPABLE":false,"TOP_URL":"http://www.tistory.com","JOIN_URL":"https://www.tistory.com/member/join","PHASE":"prod","ROLE_GROUP":"visitor"}; window.T.entryInfo = {"entryId":4875397,"isAuthor":false,"categoryId":1191931,"categoryLabel":"태그에 대해서 한번 배워볼까요?"}; window.appInfo = {"domain":"tistory.com","topUrl":"https://www.tistory.com","loginUrl":"https://www.tistory.com/auth/login","logoutUrl":"https://www.tistory.com/auth/logout"}; window.initData = {}; window.TistoryBlog = { basePath: "/m", url: "https://pshto.tistory.com", tistoryUrl: "https://pshto.tistory.com", manageUrl: "https://pshto.tistory.com/manage", token: "23PW9ucrs+SxkJW2ZrlDR+F0GrKPRAzl8JLFpQOzOquQktxrrMporeaUkA35I0YS" }; var servicePath = ""; var blogURL = "";window.T.gnbContext = {"userId":0,"userName":"","profileSrc":"https://t1.daumcdn.net/tistory_admin/blog/admin/profile_default_03.png","storyServiceURI":{"storyHome":"https://storyhome.kakao.com/","brunchStory":"https://brunch.co.kr/","kakaoStory":"https://story.kakao.com/"},"blogs":[],"tryAutoLogin":false};</script> <link rel="stylesheet" type="text/css" href="https://tistory1.daumcdn.net/tistory_admin/userblog/userblog-5da7c081e816003d82680aa120bef6fa380b0a24/static/style/revenue.css"/> <link rel="canonical" href="https://pshto.tistory.com/4875397"/>  <script type="application/ld+json"> {"@context":"http://schema.org","@type":"BlogPosting","mainEntityOfPage":{"@id":"https://pshto.tistory.com/m/4875397","name":null},"url":"https://pshto.tistory.com/m/4875397","headline":"frame 나누기","description":"프레임은 화면을 쪼개주는 역할을 합니다~! 프레임을 만들어야...화면을 알맞게 쪼개서 정당한 홈페이지를 만들수 있습니다. 물론 하나의 웹페이지로도 홈페이지 만드는건 가능하지만... 대부분 한 화면을 알맞게 쪼개서...홈페이지를 마니 만들죠...저도...2개의 프레임으로 나눠서 홈페이지를 구성했..","author":{"@type":"Person","name":"쿠욱키","logo":null},"image":{"@type":"ImageObject","url":"https://img1.daumcdn.net/thumb/R800x0/?scode=mtistory2&fname=https%3A%2F%2Ft1.daumcdn.net%2Ftistory_admin%2Fstatic%2Fimages%2FopenGraph%2Fopengraph.png","width":"800px","height":"800px"},"datePublished":"2005-10-29T18:36:57+09:00","dateModified":"2005-10-29T18:36:57+09:00","publisher":{"@type":"Organization","name":"TISTORY","logo":{"@type":"ImageObject","url":"https://t1.daumcdn.net/tistory_admin/static/images/openGraph/opengraph.png","width":"800px","height":"800px"}}} </script>  </head> <frameset rows="20%, *" frameborder="1"> <frame src=""> <frameset cols=18%,*> <frame src=""> <frame src=""> </frameset> </html>

실행결과

결과를 눌러보시면 프레임이 나뉘었을 겁니다. cols="나눌 비율/픽셀값"은 세로로 분할하기이고.. rows="나눌비율/픽셀값"은 가로로 분할하기 입니다.
다음장에프레임의 속성에 대해서 알아보도록 하죠~!