> 웹 프론트엔드 > HTML 튜토리얼 > HTML 프레임셋 태그

HTML 프레임셋 태그

WBOY
풀어 주다: 2024-09-04 16:30:32
원래의
516명이 탐색했습니다.

<프레임셋> HTML의 태그는 여러 프레임을 결합하여 단일 웹 페이지로 표시합니다. 이 문서는 프레임세트에 포함된 모든 프레임으로 구성됩니다. 프레임은 개별 창이나 웹사이트와 유사할 뿐입니다. 프레임셋 태그를 사용하면 여러 열이나 행을 구성하고 그 아래에 프레임을 포함할 수 있습니다. 이 기능은 HTML 5 이전에도 제공되었으며 다양한 문서를 결합하여 한 번에 표시하는 데 유용합니다. 각 프레임에는 해당 내용이 포함될 수 있습니다. 일반적으로 HTML이나 이미지와 같은 다른 웹 파일입니다.

구문

여기서 시작 태그는 이라는 종료 태그로 끝납니다. <프레임세트> 태그에는 하나 이상의 여러 프레임 태그가 포함될 수 있습니다. 각 프레임 태그는 속성 이름이 "src"인 태그로 프레임 내용을 전달합니다. 소개한 대로 이 콘텐츠는 HTML이나 전달 이미지 등 웹 파일과 같은 것이 될 수 있습니다.

<frameset cols / rows = ", , , " >
<frame src = "source file name. . . " >
. . . . . .
. . . . . .
<frame src = "source file name. . . " >
</frameset>
로그인 후 복사

여기에는 열 또는 행 속성이 포함된 시작 태그 프레임세트가 있습니다. 일반적으로 프레임세트 태그는 여러 프레임을 결합하는 데 사용되므로 이 두 속성은 프레임세트 태그와 함께 사용됩니다. 이러한 태그는 다양한 프레임을 배치하기 위해 행이나 열을 형성하는 데만 사용됩니다. 그러면 간단한 프레임 태그가 시작 태그 뒤에 옵니다. 프레임에 파일을 표시하려면 프레임 태그에 "src" 속성을 사용하고 파일 이름을 값으로 전달합니다. 우리는 점을 사용하여 단일 프레임이 여러 프레임을 포함할 수 있음을 보여주었습니다. 그리고 마지막으로 태그를 닫아 프레임셋 태그를 닫습니다.

프레임셋 태그 속성

아래는 프레임셋 태그가 지원하는 속성 목록입니다.

1. cols: 이 속성은 프레임을 내부에 배치하는 데 사용됩니다. cols 속성은 프레임세트를 여러 열로 나누어 프레임을 수직으로 표시합니다. 이 속성을 사용하면 프레임세트의 각 열 너비를 설정할 수도 있습니다. 이 속성에 값을 전달하여 각 프레임에 대해 서로 다른 값을 설정할 수 있습니다. 값은 백분율, 픽셀 또는 상대 길이로 전달될 수 있습니다. 이 속성의 기본값은 100%입니다.

2. 행: 이 속성은 cols 속성과도 유사합니다. 행 속성은 프레임세트를 여러 행으로 나누고 프레임이 가로로 하나씩 표시됩니다. cols 속성과 유사한 값을 전달하여 각 프레임의 높이를 설정할 수 있습니다. 행과 열을 모두 사용하면 원하는 결과를 얻을 수 있습니다. 이 속성의 기본값도 100%입니다.

3. border: 이 속성은 프레임세트 태그에 사용되어 프레임세트에 있는 각 프레임의 너비를 정의합니다.

4. 프레임 간격: 프레임 세트 태그는 "프레임 간격" 속성을 사용하여 내부 프레임 사이의 간격을 설정합니다.

HTML 프레임셋 태그 구현 예시

다음은 HTML 프레임세트 태그의 예입니다.

예시 #1

하나의 상위 창에서 서로 다른 파일을 프레임으로 사용하므로 여러 HTML 파일이 포함되어 있습니다.

코드:

메인 파일:

<!DOCTYPE html>
<html>
<head>
<title> frameset tag in HTML </title>
<style>
</style>
</head>
<frameset>
<frame src = "frame1.html" >
</frameset>
</html>
로그인 후 복사

프레임 1이라는 단일 소스 파일이 있습니다.

frame1.html:

<!DOCTYPE html>
<html>
<head>
<title> Frameset Example </title>
<style>
body {
text-align: center ;
background-color: rgb(120, 120, 120, 0.15) ;
}
</style>
</head>
<body>
<h2> Example of Frameset tag </h2>
<h1> Frame 1 </h1>
</body>
</html>
로그인 후 복사

출력:

단일 프레임에 파일이 하나만 포함되어 있으므로 페이지에는 프레임.html의 내용이 전체적으로 표시됩니다. 프레임의 너비와 높이는 기본적으로 100%입니다. 그렇기 때문에 하나의 프레임이 모든 영역을 차지하게 됩니다.

HTML 프레임셋 태그

예시 #2

예제에 프레임을 하나 더 추가하고 cols 속성을 사용하여 열별로 나누고 값을 백분율로 전달해 보겠습니다.

코드:

frame2.html:

<!DOCTYPE html>
<html>
<head>
<title> Frameset Example </title>
<style>
body {
text-align: center ;
background-color: rgb(120, 120, 120, 0.30 ) ;
}
</style>
</head
<body>
<h2> Hello World..! </h2>
<h1> Frame 2 </h1>
</body>
</html>
로그인 후 복사

메인 파일:

<!DOCTYPE html>
<html>
<head>
<title> frameset tag in HTML </title>
<style>
</style>
</head>
<frameset cols = "40% , 60 %" >
<frame src = "frame1.html" >
<frame src = "frame2.html" >
</frameset>
</html>
로그인 후 복사

출력:

여기에서는 두 개의 프레임을 전달하고 40%와 60%로 값이 전달된 cols 속성을 사용하여 분할했습니다. 첫 번째 프레임의 너비를 40%, 두 번째 프레임의 너비를 60%로 만듭니다.

HTML 프레임셋 태그

예시 #3

row 속성을 이용하여 동일한 프레임을 가로로 나누어 보겠습니다. 동일한 마지막 예를 수정하겠습니다. 차이점은 행 속성이 cols 속성을 대체한다는 것입니다. 행 속성도 cols 속성과 유사한 값을 갖습니다. 프레임 수에 따라 여러 값을 전달할 수 있습니다.

코드:

메인 파일:

<!DOCTYPE html>
<html>
<head>
<title> frameset tag in HTML </title>
<style>
</style>
</head>
<frameset rows = "50% , 50%" >
<frame src = "frame1.html" >
<frame src = "frame2.html" >
</frameset>
</html>
로그인 후 복사

출력:

여기서 출력은 높이가 50%인 두 개의 수평 프레임입니다. 이 높이는 실제 브라우저 창과 일치합니다.

HTML 프레임셋 태그

결론

HTML의 프레임셋 태그와 그 용도, 활용 방법에 대해 알아봤습니다. 이 태그는 여러 프레임을 하나의 디스플레이 창에 병합하여 표시하는 것을 목표로 합니다. 사용 가능한 속성을 사용하여 프레임의 위치와 크기를 정의할 수도 있습니다. 이 태그는 HTML 5부터 더 이상 사용되지 않습니다.

위 내용은 HTML 프레임셋 태그의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

원천:php
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿