HTML – 包含的原因是什么

我发现使用AMP需要以下 CSS boilerplate code.它有什么作用?
<style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>

任何人都可以知道在AMP页面中包含上述css代码的原因吗?

我可以写< style amp-boilerplate =“amp-boilerplate”>而不是<样式amp-boilerplate> ?

解决方法

Can anyone know the reason for including above css code in AMP pages ?

此代码本身用于隐藏页面,直到完全呈现为止,然后将其淡入以提供更高的感知性能指标.如果您询问标签本身,那么Google将在内部使用< style amp-boilerplate>来命令解析DOM和CSSOM.

Can I write < style amp-boilerplate=”amp-boilerplate”> instead of < style amp-boilerplate> ?

是的,您可以将标记名称作为标记的值,它仍将通过AMP验证.但是,建议不要这样做,因为AMP规范可能随时发生变化,这可能不再有效.

我已通过在实时页面上使用AMP验证工具并在内部同时使用NodeJS验证器和Python验证器来确认这一点.

相关文章

vue阻止冒泡事件 阻止点击事件的执行 &lt;div @click=&a...
尝试过使用网友说的API接口获取 找到的都是失效了 暂时就使用...
后台我拿的数据是这样的格式: [ {id:1 , parentId: 0, name:...
JAVA下载文件防重复点击,防止多次下载请求,Cookie方式快速简...
Mip是什么意思以及作用有哪些