HTML5 и рамки

У меня есть iframe в документе HTML5. когда я проверяю, я получаю сообщение об ошибке, указывающее, что атрибут iframe frameBorder устарел и вместо этого использует CSS.

У меня есть этот атрибут frameBorder="0", потому что это был единственный способ выяснить, как избавиться от границы в IE, я пробовал border:none; в CSS без везения. Есть ли способ устранить это?

Спасибо.

Ответы

Ответ 1

HTML 5 не поддерживает такие атрибуты, как frameborder, scrolling, marginwidth и marginheight (которые были поддержаны в HTML 4.01). Вместо этого в спецификации HTML 5 появился атрибут seamless. Атрибут seamless позволяет встроенному фрейму выглядеть так, как будто он отображается как часть содержащего документ. Например, границы и полосы прокрутки не появятся.

По данным МДН

frameborder Устаревший с HTML5

Значение 1 (по умолчанию) рисует границу вокруг этого кадра. Значение 0 удаляет границу вокруг этого фрейма, но вместо этого вы должны использовать границу свойства CSS для управления границами.

Как сказано в приведенной выше цитате, вы должны удалить границу с помощью CSS;
либо встроенный (style="border: none;"), либо в вашей таблице стилей (iframe { border: none; }).

При этом, похоже, не существует ни одного поставщика iframe, который бы не использовал frameborder="0". Даже YouTube по-прежнему использует этот атрибут и даже не предоставляет атрибута стиля, чтобы сделать фреймы обратно совместимыми, если фреймбордер больше не поддерживается. Можно с уверенностью сказать, что атрибут никуда не денется в ближайшее время. Это оставляет вам 3 варианта:

  1. Продолжайте использовать frameborder, просто чтобы убедиться, что он работает (пока)
  2. Используйте CSS, чтобы сделать "правильную" вещь
  3. Используйте оба. Хотя это не решает проблему несовместимости (так же, как вариант 1), она работает и будет работать в каждом браузере, который был и будет


Что касается предыдущего состояния этого десятилетнего ответа:

Атрибут seamless поддерживается в течение столь короткого времени (или вообще не поддерживается некоторыми браузерами), что MDN даже не отображает его как устаревшую функцию. Не используйте его и не смущайтесь комментариями ниже.

Ответ 2

В соответствии с другим сообщением здесь лучшим решением является использование записи CSS

style="border:0;"

Ответ 3

Поскольку атрибут frameBorder необходим только для IE, есть еще один способ обойти валидатор. Это легкий способ, который не требует Javascript или любых манипуляций с DOM.

<!--[if IE]>
   <iframe src="source" frameBorder="0">?</iframe>
<![endif]-->
<!--[if !IE]>-->
   <iframe src="source" style="border:none">?</iframe>
<!-- <![endif]-->

Ответ 4

Это работает

iframe{
    border-width: 0px;
}

Ответ 5

Как насчет того, чтобы использовать тот же метод для "обмана" валидатора с помощью Javascript, вставив целевой атрибут в XHTML <a onclick="this.target='_blank'">?

  • onsomething = "this.frameborder = '0'"

<iframe onload = " this.frameborder='0' " src="menu.html" id="menu"> </iframe>

Или getElementsByTagName]("iframe") 1 добавление этого атрибута для всех iframes на странице?

Не проверял это, потому что я сделал что-то, что означает, что ничего работает в IE менее 9! :) Поэтому, пока я сортирую это...:)

Ответ 6

Я нашел хорошую работу, которая позволит ей работать в IE7 здесь. Он обходит валидатор для атрибута frameBorder, но сохраняет css для будущих браузеров, как объясняется в сообщении.

Ответ 7

style="border:none; scrolling:no; frameborder:0;  marginheight:0; marginwidth:0; "