-->

March 06, 2017

amp-img AMP HTML. Untuk image, tidak diperlukan JavaScript khusus, sudah cukup dengan JS, AMP HTML secara umum. Ada perbedaan cara penulisan image dari biasanya. Kode untuk image:


<amp-img src="url-image-disini"
width="1080"
height="610"
layout="responsive"
alt="AMP HTML"></amp-img>

Layout yang support: fill , fixed , fixed-height, flex-item, nodisplay, responsive Gunakan srcset untuk menentukan gambar sesuai ukuran layar. Kodenya seperti ini
<amp-img src="https://ampbyexample.com/img/amp.jpg"
srcset="https://ampbyexample.com/img/amp.jpg 1080w, https://ampbyexample.com/img/amp-900.jpg 900w, https://ampbyexample.com/img/amp-800.jpg 800w,
https://ampbyexample.com/img/amp-700.jpg 700w, https://ampbyexample.com/img/amp-600.jpg 600w, https://ampbyexample.com/img/amp-500.jpg 500w, https://ampbyexample.com/img/amp-400.jpg 400w,
https://ampbyexample.com/img/amp-300.jpg 300w, https://ampbyexample.com/img/amp-200.jpg 200w, https://ampbyexample.com/img/amp-100.jpg 100w"
width="1080"
height="610"
layout="responsive"
alt="AMP HTML"></amp-img>
Untuk melihat efeknya, silahkan resize browser.

sumber : Kompiajaib.com

Amp, Blogger, Tutorial

You Might Also Like:

Next Post
Previous Post
How to style text in Disqus comments:
  • To write a bold letter please use <strong></strong> or <b></b>.
  • To write a italic letter please use <em></em> or <i></i>.
  • To write a underline letter please use <u></u>.
  • To write a strikethrought letter please use <strike></strike>.
  • To write HTML code, please use <code></code> or <pre></pre>or<pre><code></code></pre>.
    And use parse tool below to easy get the style.
Show Parser Hide Parser

Tambahkan Komentar Tutup Komentar

Disqus Comments