HTML 프레임워크를 사용하는 방법
- 墨辰丷원래의
- 2018-06-04 15:40:338064검색
브라우저 문서 창은 하나의 웹 페이지 파일만 표시할 수 있지만 프레임을 사용하면 동일한 브라우저 창에 두 개 이상의 페이지를 표시할 수 있습니다. 이 글에서는 HTML 프레임을 소개합니다.
1. 프레임
A 브라우저 문서 창은 하나의 웹 페이지 파일만 표시할 수 있지만 프레임을 사용하면 동일한 브라우저 창에 두 개 이상의 페이지를 표시할 수 있습니다. 프레임을 사용하는 페이지는 주로 두 부분으로 구성됩니다. 하나는 프레임 세트이고 다른 하나는 특정 프레임 파일입니다.
프레임은 주로 웹사이트 백엔드 또는 인트라넷 시스템의 레이아웃에 사용됩니다.
1. 프레임셋(f900b4fc197b16ab214eecf015bb6bd2eb5f059992a0ae0ef16884cb75644e40): 이 HTML 문서를 프레임 모드로 정의하고 창이 분할되는 방식을 설정하는 데 사용되는 파일입니다. 일반인의 관점에서 프레임셋은 프레임 구조를 저장하는 파일이자 프레임 파일에 액세스하기 위한 항목 파일이기도 합니다. 웹 페이지가 왼쪽과 오른쪽 두 개의 프레임으로 구성된 경우 왼쪽과 오른쪽 두 개의 웹 페이지 파일 외에 일반 프레임 세트 파일도 있습니다. 프레임을 사용하는 페이지에서는 6c04bd5ca3fcae76e30b72ad730ca86d 태그가 프레임 태그 f900b4fc197b16ab214eecf015bb6bd2로 대체됩니다. 프레임 페이지에 포함된 각 프레임은 04a0d55efbbfd646a993fbc01f262c57 태그를 통해 정의됩니다.
rows 속성: 창을 수평으로 분할합니다. 가로 분할 창은 페이지를 가로 방향으로 자르는 것, 즉 페이지를 상하로 배열된 여러 개의 창으로 나누는 것입니다. 행은 여러 값을 가질 수 있으며 각 값은 프레임 창의 가로 너비를 나타내며 단위는 픽셀 또는 브라우저의 백분율이 될 수 있습니다. 그러나 일반적으로 여러 행 값이 설정되면 여러 프레임이 필요합니다. 즉, 해당 개수의 04a0d55efbbfd646a993fbc01f262c57 매개변수가 필요합니다.
<html>
<head>
<title>水平分割窗口的效果</title>
</head>
<frameset rows="30%,70%">
<frame>
<frame>
</frameset>
</html>cols 속성: 창을 수직으로 분할합니다. 수직 분할 창은 페이지를 수직 방향으로 여러 개의 창으로 분할하는 것, 즉 페이지를 왼쪽과 오른쪽에 배열된 여러 개의 창으로 분할하는 것입니다. Cols는 여러 값을 가질 수 있으며 각 값은 프레임 창의 가로 너비를 나타내며 단위는 픽셀 또는 브라우저의 백분율이 될 수 있습니다. 수평 분할 창과 유사하게 일반적으로 여러 열 값을 설정하려면 여러 프레임, 즉 여러 04a0d55efbbfd646a993fbc01f262c57 매개변수가 필요합니다.
<html>
<head>
<title>垂直分割窗口的效果</title>
</head>
<frameset cols="20%,55%,25%">
<frame>
<frame>
<frame>
</frameset>
</html>frameborder 속성: 테두리를 설정합니다. 기본적으로 프레임 창 주위에는 테두리 선이 있으며, 테두리 선 표시는 프레임 테두리 매개 변수를 통해 조정할 수 있습니다. 구문은
903c5678930ed839c10f43f0bfc2ba7d또는 9468ced1fbfd0377b53ffd626652132b입니다. 프레임 경계 값은 0 또는 1만 될 수 있습니다. 값이 0이면 경계선이 숨겨지고, 값이 1이면 경계선이 표시됩니다. 프레임셋에서 설정하면 전체 프레임에 적용되며, 프레임에 설정하면 현재 프레임에만 적용됩니다.
<html> <head> <title>设置框架窗口的边框显示效果</title> </head> <frameset rows="20%,55%,25%"> <frame frameborder="1"> <frameset cols="35%,65%" frameborder="0"> <frame > <frame> </frameset> <frame frameborder="0"> </frameset> </html>
framespacing 속성: 프레임의 테두리 너비입니다. 프레임의 테두리 너비는 기본적으로 1픽셀이며 프레임 간격 매개변수를 통해 크기를 조정할 수 있습니다.
구문: 871b59c1d3d8025438383d8daa7e98db
설명: 프레임 너비는 페이지 테두리 사이의 선 너비(픽셀)입니다. 이 매개변수는 프레임세트에만 사용할 수 있으며 단일 프레임에는 유효하지 않습니다.
<html>
<head>
<title>设置框架的边框宽度</title>
</head>
<frameset rows="30%,70%" framespacing="10">
<frame>
<frameset cols="20%,55%,25%" framespacing="30">
<frame>
<frame>
<frame>
</frameset>
</frameset>
</html>bordercolor 속성: 프레임의 테두리 색상입니다. 프레임세트의 테두리 색상을 설정하려면 bordercolor 매개변수를 사용하세요.
구문: f0d0dc684c56fd837e4f665fba7d841a
설명: 이 매개변수는 단일 프레임이 아닌 전체 프레임세트에만 유효합니다.
<html>
<head>
<title>设置框架的边框颜色</title>
</head>
<frameset rows="30%,70%" framespacing="10" bordercolor ="#CC99FF">
<frame>
<frameset cols="20%,55%,25%" framespacing="30" bordercolor ="#9900FF">
<frame>
<frame>
<frame>
</frameset>
</frameset>
</html>2. 프레임(04a0d55efbbfd646a993fbc01f262c57) 및 src 속성.
프레임 구조의 각 페이지는 별도의 텍스트이며 이러한 파일은 src 매개변수를 통해 설정됩니다.
구문: 6a23c44924cf0fbcdad49283aac55d22
설명: 페이지 파일은 프레임 페이지의 특정 내용이 있는 곳입니다. 소스 파일이 없는 프레임의 경우 빈 페이지일 뿐입니다. 효과가 없습니다. 페이지의 소스 파일은 일반 HTML 파일일 수도 있고 이미지 또는 기타 파일일 수도 있습니다.
<html>
<head>
<title>设置页面源文件</title>
</head>
<frameset rows="30%,70%">
<frame src="pic01.gif">
<frame src="src01.html">
</frameset>
</html>3.37f861bd36cef5b6406eba87d20a5bab23a17d2cc9873ab460d73d80ccc8d7a4 태그
37f861bd36cef5b6406eba87d20a5bab23a17d2cc9873ab460d73d80ccc8d7a4 태그는 브라우저가 프레임을 지원하지 않을 때 페이지 콘텐츠를 표시하는 데 사용됩니다.
<html>
<frameset cols="25%,50%,25%">
<frame src="/example/html/frame_a.html">
<frame src="/example/html/frame_b.html">
<frame src="/example/html/frame_c.html">
<noframes>
<body>您的浏览器无法处理框架！</body>
</noframes>
</frameset>
</html>2. 플로팅 프레임(d5ba1642137c3f32f4f4493ae923989c)
플로팅 프레임은 브라우저 창에 하위 창을 중첩하는 더욱 특별한 프레임입니다. 즉, 전체 페이지가 프레임 페이지가 아닙니다. 여기에는 프레임 창이 포함되어 있습니다. 프레임 창 내에 해당 페이지 콘텐츠를 표시합니다. 부동 프레임은 인라인 프레임이라고도 불리므로 이름이 붙었습니다.
구문: 1298082b4e924d1f7ef50aa51285ad2e065276f04003e4622c4fe6b64f465b88
설명: 일반 프레임 구조와 유사하게 부동 프레임은 이름, 스크롤, 프레임 테두리 등과 같은 많은 매개변수를 설정할 수도 있습니다. 그러나 일반 프레임과 비교할 때 부동 프레임에는 프레임 간격 및 테두리 색상 매개변수가 포함되어 있지 않습니다.
src属性：浮动框架中最基本的参数就是src，它用来设置浮动框架页面的源文件地址，也是浮动框架页面必需的参数。因为只有设置了源文件的内容，浮动框架才有意义。语法：290763ae73a8bb3b5c012455bf37fc39
width和height属性：在普通框架结构中，由于框架就是整个浏览器窗口，因此不需要设置其大小。但是在浮动框架中，是插入到普通HTML页面中的，可以调整整个框架的大小。语法：1ae60c9a2f4a841f9b41850969e580f3，页面的宽度和高度值都以像素为单位。
<html> <body> <iframe src="/i/eg_landscape.jpg" width="550" height="310" ></iframe> <p>一些老的浏览器不支持 iframe。</p> <p>如果得不到支持，iframe 是不可见的。</p> </body> </html>
三、一个框架布局的示例
<html>
<head>
<title>框架主页面 </title>
</head>
<frameset rows="20%,*"><!--框架集，控件文件的容器-->
<frame name="topFame" src="3.html" noresize/>
<frameset cols="240px,*">
<frame name="leftFrame" src="1.html"/>
<frame name="rightFrame" src="2.html" marginwidth="20px" scrolling="no"/>
</frameset>
<noframes>
<!--noframes标记当中可以包含body标记-->
<body>
该页面不支持frameset标签！
</body>
</noframes>
</frameset>
</html>四、链接如何跳出框架
在网站后台布局中，框架用得比较多。在很多时候，我们需要跳出框架，重新加载页面。那么链接如何才能跳出框架呢？其实，只需要指定3499910bf9dac5ae3c52d5ede73834855db79b134e9f6b82c0b36e0489ee08ed标签的target属性为"_top"即可实现。下面是一个简单的例子。
<html> <body> <p>被锁在框架中了吗？</p> <a href="/index.html" target="_top">请点击这里！</a> </body> </html>
总结：以上就是本篇文的全部内容，希望能对大家的学习有所帮助。
相关推荐：
HTML框架标签frameset、frame、iframe、noframes
위 내용은 HTML 프레임워크를 사용하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!