HTML/CSS/Frame Tags/iframe

Материал из Web эксперт
Перейти к: навигация, поиск

An inline frame

 
<?xml version="1.0" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
  <title>An inline frame</title>
</head>
<body>
<h1>Floating frame</h1>
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Ut risus tellus, hendrerit id, sagittis sed, lobortis eget, augue.
  <iframe src="http://www.wbex.ru">
    you might need to upgrade your browser.
  </iframe>
 Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Ut risus tellus, hendrerit id, sagittis sed, lobortis eget, augue.</p>
</body>
</html>



"iframe" identifies a frame that can be placed anywhere inside a document

    
<html>
<head>
<title>iframe element example</title>
</head>
<body>
    <p align="center">
    <iframe id="myIframe" 
            frameborder="1" 
            scrolling="yes"
            src="http://www.wbex.ru" width="600" height="400">
    </iframe>
    </p>
<br><br><br>
    <p align="center">
    <iframe id="myIframe" 
            frameborder="10" 
            scrolling="yes"
            src="http://www.wbex.ru" width="600" height="400">
    </iframe>
    </p>
</body>
</html>



iframe style

 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <title></title>
<style type="text/css" title="text/css">
#iframewrapper {
    width: 200px;
    border: solid 10px #777777;
}
#bordered {
    width: 200px;
    height: 200px;
}
iframe {
    width: 200px;
    height: 200px;
}
</style>
</head>
<body>
    <div id="iframewrapper">
        <iframe src="http://www.wbex.ru" 
                scrolling="auto" 
                name="news" 
                frameborder="0" 
                id="news">Your browser doesn"t support iframes. Please 
                          <a href="http://www.wbex.ru">click here</a> 
                          to see the content.
        </iframe>
    </div>
</body>
</html>



target="iframe"

 
<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <title>Football focus</title>
</head>
<body>
  <h1>Quarter Final - Wintertons Cup</h1>
  <h3>
    <a href="" target="iframe">R</a> 
    vs
    <a href="" target="iframe">B</a>
  </h3>
  <p><iframe name="iframe" width="300" height="150" src="http://www.wbex.ru" align="left"></iframe>
this is a test. this is a test.  
  </p>
</body>
</html>



Use css to replace iframe

 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <title></title>
<style type="text/css" media="Screen">
#internal {
    width: 200px;
    height: 100px;
    background: #999999;
    overflow: auto;
}
</style>
</head>
<body>
    <div id="internal">
        <p>this is a test. this is a test. this is a test. this is a test. 
        this is a test. this is a test. this is a test. this is a test. 
        this is a test. this is a test. this is a test. this is a test. 
        this is a test. this is a test. this is a test. this is a test. </p>
    </div>
</body>
</html>
Источник — «http://wbex.ru/index.php?title=HTML/CSS/Frame_Tags/iframe&oldid=5416»