可以在amp-img中使用内联样式吗？
在amp-img中使用内联样式是不允许的。AMP（加速移动页面）是一种用于构建快速加载的移动页面的开放源代码框架。为了确保页面的快速加载和性能优化，AMP限制了对HTML元素的样式设置。
在AMP中，amp-img是用于显示图像的特定标签。为了确保页面加载速度，AMP要求在amp-img中使用外部样式表来设置图像的样式，而不允许使用内联样式。这是因为内联样式会增加HTML文件的大小，从而影响页面加载速度。
如果您想为amp-img设置样式，可以通过在HTML文档的头部引入外部样式表，并在样式表中定义amp-img的样式。例如：
<head>
<style amp-custom>
amp-img {
width: 200px;
height: 200px;
}
</style>
</head>
<body>
<amp-img src="image.jpg" alt="Image"></amp-img>
</body>在上面的示例中，我们通过amp-custom样式表定义了amp-img的宽度和高度。这样可以确保样式与AMP的要求相符，并且不会影响页面的加载速度。
推荐的腾讯云相关产品：腾讯云CDN（内容分发网络）。腾讯云CDN是一种分布式部署的网络加速服务，可以提供快速、稳定的内容分发，加速网站、应用、音视频等内容的传输，提升用户访问体验。您可以通过腾讯云CDN来加速AMP页面中的图像加载，提高页面的加载速度和性能。
腾讯云CDN产品介绍链接地址：https://cloud.tencent.com/product/cdn
相关·内容
我有一个图像渲染使用amp和我想使用内联样式。我尝试了以下几种方法： <div style=" position: relative;width:240px; height:120px;"></div> 但是amp-img的内联
浏览 34提问于2020-07-06得票数 0
我同时使用Google AMP (moustache.js)和Laravel Blade。，我所要做的就是在括号前添加@。<!activity/all" class="m1" <template type="amp-mustache">
<amp-imgwidth="108&q
浏览 0提问于2018-09-13得票数 1
1回答
我遇到了一个关于amp-img的问题。源代码<amp-img /><span>...</span> ->呈现的html <amp-img><span>...</span></amp>源代码<amp-im
浏览 13提问于2017-12-20得票数 0
在很多情况下，img标记没有设置height或width属性，而图像源是对外部URL的引用。我想过向URL发出请求以获取图像的高度和宽度，然后使用这些值设置高度和宽度属性，但这似乎不是正确的解决方案。我尝试的另一件事是将高度和宽度设置为任意值，然后尝试通过设置amp-img {height:auto;width:auto}覆盖样式表中的宽度和高度属性，但在这种情况下，图像仍将以最初声明的纵横比呈现。
浏览 31提问于2017-02-14得票数 1
大家好，我有这个Wordpress网站，我想转化为一个AMP网站，其中的挑战之一是重写css的内联。<link rel='stylesheet' id='style' href='Path_to/css/stle.css' type='text/css' media='all' /&g
浏览 17提问于2019-12-16得票数 1
回答已采纳
我希望图像以全宽填充列，所以我使用<amp-img layout='responsive'>。这可以很好地工作，除了比列更窄的图像-在这种情况下，responsive模式放大它们，这是不可取的。我可以通过将较小的图像设置为fixed layout来解决此问题。但是该在哪里停下来呢？如果我将所有图像设置为fixed，则较大的图像将从列中分离出来。我不知道px中的列的宽度，所以不能改变基于它的逻辑。
在CSS中，我可以简单地
浏览 26提问于2016-08-12得票数 4
如何使用已设置样式的组件设置自定义标记的样式？这是我想要做的：filter: blur(2px);`
谢谢！
浏览 0提问于2018-02-07得票数 3
我想把旋转木马中的图像缩放到一个固定的高度&一个自动宽度。我试着省略了amp元素的宽度&使用layout=“固定高度”，但这根本行不通。医生们很混乱。<amp-carousel width=500 height=300>
<amp-img src="http://placehold.it/200x600" width=200 height=600></amp-img<
浏览 6提问于2016-03-04得票数 7
回答已采纳
我在我的一个页面上实现了AMP-carousel。我打算在手机和桌面上使用amp页面，因为我的网站相对简单，我不需要有两个不同的版本。问题是AMP-carousel在IE和Safari上不能很好地工作。看看这里的官方例子，当你在IE或Safari中看到它时，控制滑块的箭头在第一张图片后没有出现，这让我认为这是一个“官方”。我在我的页面中使用了这个例子： height="3
浏览 0提问于2016-11-05得票数 0
我可以使用xhtml <amp-img />而不是<amp-img></amp-img>吗？我知道它有效，但它支持吗？
浏览 3提问于2016-02-25得票数 1
回答已采纳
我理解如何使用媒体查询来实现这一点，但是是否有更好的/更好的方式使用AMP特定的代码？
我正在积累关于AMP的知识，但我错过了什么吗？
浏览 1提问于2018-08-24得票数 1
有一个带有多个amp-carousel的amp-img每个amp-img都显示在一个slide中。旋转木马和灯箱按预期工作。
但是我不能把amp-img放在slide中。如何使amp-img在amp-carousel slide中居
浏览 1提问于2018-03-06得票数 0
回答已采纳
我有一个问题，AMP旋转箭头在我的移动网站。我想把它展示出来。有谁能帮我实现这个目标吗。 <amp-img src="images/image2.jpg" height="300"
layout="responsive"alt="lemons"></
浏览 1提问于2018-05-14得票数 4
回答已采纳
在AMP页面上，我想在样式标签中添加对我的字体的引用。我们可以使用静态来做到这一点吗？format("truetype"), url("{% static '/webfonts/fa-brands-400.svg#fontawesome' %}") format("svg"); } src="{%
浏览 0提问于2018-03-20得票数 1
在<amp-img>中有使用onerror属性的方法吗？<img src="../images/some-logo1.jpg" onerror="this.src='../images/no-img.jpg';" class="posting-logo-img">
但是amp html将在amp-img
浏览 5提问于2017-08-10得票数 4
回答已采纳
我的网站具有xml文件中的内容，并使用xsl样式表显示它，因此客户可以轻松地编辑内容，但是如果我使用amp-img标记，即使我在样式表中使用了结束标记，xsl转换也会自动关闭这些标记。然后，当我使用w3c html验证器测试页面时，它会给出错误，指出下面的标记没有关闭。以下是错误的示例：
在非void HTML元素上使用的自关闭语法(/>)。忽略斜杠并将其视为开始标
浏览 5提问于2017-05-12得票数 0
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
即时通信 IM
对象存储活动推荐
腾讯云开发者
