Использование фрейма

Использование фрейма

Код для вставки фрагмента с другого сайта на свой сайт

<!--noindex--><iframe src="https://edavcem.ru/" width="650" height="600" scrolling="auto"> Ваш браузер не поддерживает iframe!</iframe><!--/noindex-->

— Ваш браузер не поддерживает iframe! — сообщение для браузеров не поддерживающих iframe!
— scrolling=»auto» атрибут прокрутки встроенного окна. Если заменить «auto» на «no» прокрутка работать не будет
— так же ссылка на используемый сайт-донор и размеры отображаемого окна.

Чтобы уточнить выделенную зону можно использовать ID элемента

<!--noindex--><iframe src="https://edavcem.ru/#element" width="650" height="600" scrolling="auto"> Ваш браузер не поддерживает iframe!</iframe><!--/noindex-->

Где «#element» – это ID нужного вам элемента на странице. Изменяя ширину и высоту окна можно выделить нужный элемент.

В окончательном варианте с использованием классов и стилей CSS отображение нужного элемента с помощью iframe выглядит так

<div class="iframe_block">

	<iframe src="https://edavcem.ru/" class="iframe_class" scrolling="no">Ваш браузер не поддерживает iframe!</iframe>

</div>

в стилях прописываем

<style>
	.iframe_block {
		overflow: hidden;
		width: 400px; /* Ширина окна */
		height: 300px; /* Высота окна */
	}

	.iframe_class {
		border: 0px;
		margin-left: -200px; /* Положение по горизонтали */
		margin-top: -33px; /* Положение по вертикали */
		width: 1000px;
		height: 1000px;
	}
</style>

— .iframe_block – размеры окна для отображения iframe
— .iframe_class – стили положения iframe здесь настраивается показ определенной области на встраиваемом сайте.