Cara membuat style teks warna di AMP
HALLO DUNIA
Seperti yang telah di ketahui AMP atau
Accselarated Mobile pages
Telah membawa kita ke masa depan yang lebih mudah dan proyek AMP kini sudah memiliki pengguna lebih 700jt woow
Tapi dengan adanya fiktur AMP kini menulis artikel jadi sulit di lakukan .kita musti belajar lagi dari nol, pasalnya banyak larangan larangan yang harus kita patuhi untuk mendapatkan halaman AMP yang valid
Sedikit saya jelaskan pengalaman saya minggu minggu ini setelah meng Upgrad ke AMP atau halaman yang di percepat , Banyak waktu yang kebuang hanya untuk mendapatkan sebuah halaman yang valid AMP , saya pikir gampang hanya mengganti template terus halaman saya langsung berubah menjadi amp ternyata tidak , saya harus bolak balik masuk ke blog orang dan mencari materi untuk merubah semua Artikel seperti menggati tag gambar mengganti tag tulisan style dan semuanya harus di lakukan secara manual,
banyak atribut html5 yang tidak valid di AMP seperti <img src=" "/> kini tidak bisa lagi di gunakan harus di ganti menjadi <amp-img
Yang paling saya kesel adalah inline style seperti ini tidak boleh kita terap kan
<span style="color: red;">Merah</span></div>Ini sama tidak boleh
<div dir="ltr" style="text-align: left;" trbidi="on">Jika kalian belum membuat halaman AMP saya saranin nantia ajah dulu .nunggu penyempurnaan karna masih banyak yang harus di sempurnakan
Tapi jika sudah memasang .yuk simak cara membuat style warna teks yang valid amp ini menurut saya lumayan penting untuk membuat sebuah tag di artikel
Apa lagi artikel yang membahas sebuah tutorial karna jika tutorial tanpa di tag dengan teks warna itu kurang menarik menurut saya .
Seperti yang saya bahas barusan bahwa style inline seperti ini di larang maka saya punya gantinya
<span style="color: red;">Merah</span></div>Kita akan mengandalkan html <mark> yang akan saya beri css untuk menghasilkan warna teks dan di panggil melalui class
SIMAK
Pada umum nya kode <mark> di gunakan untuk membuat tulisan warna dengan background seperti ini
Dan di tulis seperti ini <mark></mark>
Namu akan saya beri backround transparan dan warna teks merah SEPERTI INI
Maka kita membutuhkan css sperti ini
mark.red{background-color:transparent;color:red}
p,blockquote,pre,table,figure,hr,form,ol,ul,dl{margin:1.5em 0}
hr{height:1px;border:none;background-color:#666}<mark class="red">MERAH</mark>WARNA BIRU
mark.blue{background-color:transparent;color:blue}
p,blockquote,pre,table,figure,hr,form,ol,ul,dl{margin:1.5em 0}
hr{height:1px;border:none;background-color:#666}<mark class="blue">WARNA BIRU</mark>catatan!!!
Kalian pasang css di template kalian lalu untuk menulis kalian panggil dengan class
Maaf kan saya hanya itu yang saya tau semoga membantu cek validasi AMP
