HTML5 и фреймбордер

Question

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

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

Спасибо.

Answer 1

Как и в другой публикации здесь , лучшее решение - использовать CSS-запись

style="border:0;"

Answer 2

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

Согласно MDN

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 даже не отображает его как устаревшую функцию. Не используйте его и не смущайтесь комментариями ниже.

Answer 3

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

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

Answer 4

Это работает

iframe{
    border-width: 0px;
}

Answer 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!:) Так что пока я разбираюсь с этим ...:)

Answer 6

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

Answer 7

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