How to set in amp page like follow?
<p align="center"><img src="img/LOCK1.png" width="40"> <img src="img/lock2.png" width="40"> <img src="img/LOCK3.png" width="40"></p>
Thank You!
How to set in amp page like follow?
<p align="center"><img src="img/LOCK1.png" width="40"> <img src="img/lock2.png" width="40"> <img src="img/LOCK3.png" width="40"></p>
Thank You!
For amp you need to use amp-img tag
AMP HTML files don't support the normal HTML img tag. With amp-img AMP provides a powerful replacement.
<p>
<amp-img src="img/LOCK1.png" layout="fixed" width="40" height="40" alt="Lock1"></amp-img>
<amp-img src="img/lock2.png" layout="fixed" width="40" height="40" alt="Lock2"></amp-img>
<amp-img src="img/LOCK3.png" layout="fixed" width="40" height="40" alt="Lock3"></amp-img>
</p>
Please refer : amp-img
You can not use inline and external css in amp
You could use internal css with following syntax
<style amp-custom>
p {
text-align: center;
}
</style>
Borrowing much from @Bachcha Singh's answer, I only succeeded when I did it as shown below after adding a div around the image code and the inline css code just below the image AMP code. This is how I managed to center my image on my AMP page
<div class="img-wrapper">
<amp-img src="https://jomutech.com/dispJomutechIcon.png height="50" width="250" alt="Logo">
</amp-img>
</div>
<style amp-custom>
div.img-wrapper {
text-align: center;
}
</style>