AMP自定义样式【ytkah英译AMP-3】
AMP页面是网页;页面及其元素的任何样式都是使用常见的CSS属性完成的。在<head>中嵌入的样式表中使用类或元素选择器的样式元素，<style amp-custom></style>，如下代码演示，注意：amp禁止引入除字体外的css文件<link rel=”stylesheet”>
<style amp-custom>
/* any custom style goes here */
body {
background-color: white;
}
amp-img {
background-color: gray;
border: 1px solid black;
}
</style>每个AMP页面只能有一个单一的嵌入样式表和内联样式，但有些选择器你不允许使用：
- 不允许使用和引用!important。这是使AMP能够执行其元素大小调整规则的必要要求。
- 除了自定义字体不允许使用<link rel=”stylesheet”>
- 验证器不允许使用含 i-amphtml- 标记的名称。这些是AMP框架内部保留使用的。因此，用户的样式表不能引用带 i-amphtml- 类和标记的CSS选择器。
AMP在页面布局元素时遵循更严格的规则。在普通的HTML页面上，几乎完全使用CSS来布局元素。但出于性能原因，AMP要求所有元素都有明确的大小设置从一开始。
参考资料 https://amp.dev/documentation/guides-and-tutorials/develop/style_and_layout/style_pages/?format=websites
本文参与 腾讯云自媒体分享计划，分享自作者个人站点/博客。
原始发表：2020-06-15 ，如有侵权请联系 cloudcommunity@tencent.com 删除
评论
登录后参与评论
推荐阅读