CSS 样式在 iframe 内外表现不同
CSS styles behave differently inside & outside iframe
嵌套列表在普通 html 和 iframe 中看起来不同。首先看一下 li:如果 li 没有文本,iframe 中的 ol 元素不会换行到下一行。
这是 fiddle:
`https://jsfiddle.net/Lwj9jjj1/1/`
我认为它必须与 html5 相关。 iframe 可能不符合 html 标准行为。
我对图像有同样的问题 - 在 iframe 中它们没有垂直 space 在它们之后,而在 iframe 中没有 - 它们有。我通过向图像添加 vertical-align 属性 来解决这个问题。 fiddle:
`https://jsfiddle.net/Lwj9jjj1`
您在 iframe 中使用了 quirks 模式,所以是的,您的 iframe 的行为与使用标准模式的主要 fiddle 不同。
解决方案:在 iframe 中也使用标准模式。
var content = '<!DOCTYPE html><title></title> <ol> <li> <ol> <li>a</li><li> <ol> <li>b</li></ol> </li></ol> </li></ol>';
嵌套列表在普通 html 和 iframe 中看起来不同。首先看一下 li:如果 li 没有文本,iframe 中的 ol 元素不会换行到下一行。
这是 fiddle:
`https://jsfiddle.net/Lwj9jjj1/1/`
我认为它必须与 html5 相关。 iframe 可能不符合 html 标准行为。
我对图像有同样的问题 - 在 iframe 中它们没有垂直 space 在它们之后,而在 iframe 中没有 - 它们有。我通过向图像添加 vertical-align 属性 来解决这个问题。 fiddle:
`https://jsfiddle.net/Lwj9jjj1`
您在 iframe 中使用了 quirks 模式,所以是的,您的 iframe 的行为与使用标准模式的主要 fiddle 不同。
解决方案:在 iframe 中也使用标准模式。
var content = '<!DOCTYPE html><title></title> <ol> <li> <ol> <li>a</li><li> <ol> <li>b</li></ol> </li></ol> </li></ol>';