amp-story是否可以与Normalize.css和Basscss完全兼容?

时间:2018-10-14 18:45:29

标签: css amp-html normalize-css amp-story

amp-story是否可以与Normalize.css和Basscss一起使用?我问,因为AMP Start是建立在以下两个现有开源项目之上的:

https://www.ampstart.com/howitworks

Normalize.css

Normalize.css使浏览器更一致地渲染所有元素,并符合现代标准。它只针对需要规范化的样式。这提供了一个清晰的清单,可以为跨设备的AMP Start定义清晰一致的样式。

低音

AMP启动是使用Basscss(一种低级CSS工具包)构建的。 Basscss是一个非常轻巧的工具包,它提供了许多CSS实用程序类,可帮助我们执行布局,响应式Grids等操作,而无需编写任何自定义的CSS。

Basscss开箱即用,反应灵敏,这对于AMP Start非常重要。我们使用Basscss作为基础(无附加组件),但是我们从CSS规则中删除了“!important”的所有实例,因为“!important”与AMP不兼容。通过使用现有的Basscss类,即使有AMP的50Kb CSS限制,我们也可以编写更少的CSS并制作出美观的页面。

在这两个项目提供的基础之上,我们向CSS添加了一组更加自以为是的样式,以便组件和模板将继承AMP Start的一致外观。

总而言之,CSS占用的AMP不到50kB配额的一半,因此您应该有足够的空间使用Basscss和AMP Start类自定义页面。

1 个答案:

答案 0 :(得分:1)

是的,它们都产生纯CSS,可以在amp-story中使用。像所有AMP文档一样,需要在<style amp-custom>块中内联CSS。

请参见AMP Style & layout documentation的“向页面添加样式”部分。