текст по правому краю iframe

Я хотел бы сделать индекс (iframe) страницы, но я не могу сделать перед текстом. Текст идет за iframe или iframe не в правом углу, независимо от того, что я пытаюсь.текст по правому краю iframe

page.html

<?xml version="1.0" encoding="UTF-8"?> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> 
<head> 
    <title>page</title> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> 
</head> 

<body> 


    <iframe src="index.html" height="520" style="right: 10px; position:fixed"> 
    </iframe> 


some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text -- some text 

</body> 
</html>

index.html

<?xml version="1.0" encoding="UTF-8"?> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> 
<head> 
    <title>index</title> 
    <style type="text/css"> 
     <!-- 
      BODY { 
      COLOR: #0080FF; 
      BACKGROUND: black; 
     --> 
    </style> 
</head> 
<body> 

some text </br> 

some text </br> 

some text </br> 

</body> 
</html>

Я хотел бы иметь текст на стороне фрейма не позади и фрейма на правой стороне текста плавающей при прокрутке так это всегда видно. ifame не должен идти вверх или вниз, как и весь текст на странице. Или есть лучший способ сделать это, а не с iframe?

источник

2015-09-13 andrej

Вы можете достичь этого с помощью некоторых простых поплавков. Я бы переместил ваш стиль CSS to an external file. Это простой пример для вас, чтобы заполнить все остальное, что вы хотите.

// style.css 
 

 
.container { 
 
    width: 100%; 
 
    height: auto; 
 
} 
 
.some-text { 
 
    float: left; 
 
    width: 250px; // change to whatever you like 
 
} 
 
iframe { 
 
    position: fixed; 
 
    float: right; 
 
    height: 120px; 
 
    width: 250px; // change to whatever you'd like 
 
}


 

 
<!-- page.html --> 
 

 
<div class="container"> 
 
    <div class="some-text"> 
 

 
    <h1>Some Heading</h1> 
 
    <p>Some text, some text, some text</p> 
 

 
    </div> 
 

 
    <iframe src="index.html" frameborder="0" /> 
 

 
</div>

источник

2015-09-13 15:49:45

Как я могу сделать ссылку в index.html, чтобы перейти к части page.html без загрузки всей страницы. – andrej

Вы хотите загрузить ссылку в iframe @andrej? –

нет, в странице.html. Кажется, я нашел его. Я добавлю 'target =" _ parent "' в index.html. – andrej

прокрутки вниз, и вы увидите, что IFrame остается там, где она есть. Вот fiddle

.wrapper { 
 
    width: 100%; 
 
    height: auto; 
 
} 
 
.maintext { 
 
    float: right; 
 
    width: calc(100% - 320px); 
 
} 
 
iframe { 
 
    position: fixed; 
 
    float: left; 
 
    top:10px; 
 
    height: 300px; 
 
    width: 300px; 
 
}

<div class="wrapper"> 
 
    <div class="maintext"> 
 

 
    <h1>Heading</h1> 
 
    <p><strong>Scroll and you will see that the iframe stays put.</strong> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam tincidunt libero nec justo tempus, facilisis dictum leo pellentesque. Proin nulla est, dignissim ac nibh at, cursus imperdiet nisl. Sed cursus libero at varius viverra. Proin rutrum placerat dapibus. Mauris sed justo vestibulum, ultricies risus nec, ullamcorper erat. Pellentesque in gravida magna, nec feugiat dui. Proin urna nunc, mattis eu pellentesque ultricies, accumsan vel dui. 
 

 
Donec faucibus sit amet neque vitae semper. Vivamus rhoncus egestas convallis. Morbi rutrum tellus et diam pharetra, nec vehicula lectus facilisis. Etiam blandit augue quis volutpat luctus. Etiam rhoncus sodales suscipit. Quisque pellentesque vitae arcu at ullamcorper. Vivamus lectus dui, varius vel enim ac, gravida molestie augue. Mauris sed tortor nisi. 
 

 
Quisque id orci facilisis, faucibus metus et, ullamcorper tellus. Interdum et malesuada fames ac ante ipsum primis in faucibus. Vivamus semper lacus egestas mauris sodales, et efficitur velit iaculis. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Vivamus eleifend odio eget eleifend lobortis. Morbi et ante scelerisque erat sagittis dictum. Maecenas nec arcu id enim euismod sagittis. Sed consectetur porttitor sodales. Integer ac pretium risus. Cras vel tortor eros. Nunc ut orci ultricies, euismod ante sit amet, volutpat mauris. Fusce ultrices turpis ut luctus vulputate. Cras vitae hendrerit quam. Maecenas in augue varius, scelerisque sapien ut, suscipit neque.</p> 
 

 
    </div> 
 

 
    <iframe src="http://www.musicmatters.ie" frameborder="1" /> 
 

 
</div>

источник

2015-09-13 16:32:59

Я думаю, что левые и правые ошибочны в этом ответе. Они должны переключаться. – andrej

текст по правому краю iframe

ответ

Смежные вопросы