#html #css
#HTML #css
Вопрос:
У меня есть заголовок, который также включает выпадающий список файла «header.html » с размером 1024×180 пикселей. Поскольку я хотел бы использовать этот заголовок для многих страниц позже, я хотел бы иметь заголовок в отдельном файле и импортировать его позже.
Теперь на веб-странице я импортирую свой заголовок с помощью iframe следующим <iframe style="border-width:0px; width: 1024px; height: 180px"src="common/header.html"></iframe>
образом. Я пытаюсь установить iframe с размером заголовка (1024×180). Этого достаточно в обычных обстоятельствах, когда выпадающего списка нет. Однако, когда появляется выпадающий список, очевидно, что места недостаточно, и, таким образом, iframe помещает прокрутку, чтобы увидеть дополнительную выпадающую информацию
Я попытался добавить свойства overflow:visible в стиле, но, похоже, он не работает добавить все. На самом деле, все свойства overflow не работают, независимо от того, какие настройки он установил (поскольку по-прежнему требуется прокрутка для просмотра дополнительного содержимого). Обычная настройка «прокрутка = нет» также не решается, поскольку она просто отключает прокрутку.
Конечно, я могу установить высоту на большое число, чтобы компенсировать потребность в высоте, если есть выпадающий список, но это также оставляет для него много места. Я хочу, чтобы в обычном случае заголовок не перекрывался с другим объектом, но если есть выпадающий список, допустимо, чтобы он перекрывался с другим элементом ниже. Это возможно, если заголовок записан в текущем HTML-файле, но не при импорте iframe в данный момент. И, наконец, я не хочу менять положение другого элемента HTML, так как я не хочу переносить слишком много настроек на несколько страниц.
Мой вопрос в том, как обрабатывать iframe, поскольку он был обычным объектом (или, в моем случае, обычным заголовком)? Если это невозможно, какой другой вид импорта я могу использовать (который включает только HTML или, самое большее, JavaScript)
Ответ №1:
То, что вы ищете, может быть достигнуто с помощью iframe, но вы не должны этого делать. Насколько я понимаю, вы хотели бы создать один файл заголовка в виде HTML-файла, а затем скопировать его на каждую страницу. Как вы выяснили, одна из проблем заключается в том, что фреймы iframe не могут переполняться. Это означает, что все, что должно «всплывать» над iframe, должно быть включено в родительскую html-страницу, а iframe должен отправлять родительскому объекту инструкции javascript относительно того, какое всплывающее окно должно быть открыто / закрыто.
Было бы намного лучше решить эту проблему на стороне сервера. Например, в php вы можете создать header.php
файл и для каждого файла шаблона (скажем shop.php
, home.php
) вы просто добавляете файл заголовка вверху, вот так:
<?php include('header.php'); ?>
Комментарии:
1. Вы слышали о
<base>
теге? Поместите его в документ iframe и нажмите на ссылку из этого документа.<base target="_parent">
2. @Chloe Anderson: спасибо, что указали на это. Я отредактировал свой ответ. Итак, в принципе, да, вы можете открывать гиперссылки в родительском файле, но по-прежнему нет всплывающего окна, которое было бы удобно использовать в качестве меню заголовка.