Skip to main content

Style Penulisan, Font, dan Atribut Lain Blog Anasupar.Com

Tulisan ini merupakan sebuah catatan khusus yang ada diBlog Anasupar.Com. Bisa dikatakan bahwa  yang ana tulis adalah notes dari style penulisan, font, dan atribut lain yang ada diBlog ana.

1. Memasukan Kode CSS, HTML pada Syntax Highlighter
<pre><code>
<!--Masukkan kode CSS,HTML disini-->
</pre></code>

2. Membuat spasi antar paragraf halaman dengan menyisipkan kode dibawah ini pada tampilan HTML
paragraf satu
<p></p>
paragraf dua

3. Menulis text arab.
<div class="text-arab">
<!--ketik text arab disini-->
</div>

4. Menambahkan gambar pada isi artikel.
Kode untuk memasang gambar adalah seperti dibawah ini:
<amp-img alt='judul-alt-gambar' height='300' layout='responsive' src='url-gambar.jpg' width='430'></amp-img>
Ubah ukuran gambar dan layout nya sesuai keinginan Anda

5. Embed video Youtube pada postingan.
Ambil kode video dari url video Youtube yang ingin gunakan. 
Letakkan pada kode amp-youtube. 
<amp-youtube data-videoid='xxxxxxxxxxx'height='270' layout='responsive' width='480'></amp-youtube>
Ubah bagian yang di blok warna dengan kode video Youtube yang dipilih

6. Membuat Mark/highlight.
Tuliskan pada tampilan HTML
<mark><!--Mark/highlight--></mark>

7. Membuat tulisan code.
Tuliskan pada tampilan HTML
<code><!--tulisan code--></code>

8. Dropcaps. 

Nama saya Suparyono, lahir di Mulyadadi wilayah kabupaten Cilacap. Alhamdulillah telah menikmati repotnya belajar tingkat Sekolah Dasar sampai Perguruan Tinggi dengan predikat lulus.

Tuliskan pada tampilan HTML

<span style="color:#1E5D84;font-size:50px;font-weight:600;line-height:1.12em;margin-right:10px;float:left">N</span><span style="color:#1E5D84">ama saya Suparyono,</span> lahir di Mulyadadi wilayah kabupaten Cilacap. Alhamdulillah telah menikmati repotnya belajar tingkat Sekolah Dasar sampai Perguruan Tinggi dengan predikat <i>lulus</i>.

9. Blockquote

sebaik-baik kalian adalah orang yang belajar al qur'an dan mengajarkannya

Tuliskan pada tampilan HTML

<blockquote>sebaik-baik kalian adalah orang yang belajar al qur'an dan mengajarkannya</blockquote>

10. Tabel Responsive AMP HTML

Bokingan Hari Biasa
Jenis Kamar Harga Jumlah Kamar Jumlah
Ekonomi Rp. 150.000 5 kamar Rp. 750.000
Standar Rp. 200.000 5 kamar Rp. 1.000.000
Standar AC Rp. 300.000 4 kamar Rp. 1.200.000
VIP/Family Rp. 350.000 1 kamar Rp. 350.000

Tuliskan dalam tampilan HTML

<div class='table-responsive'>
  <table class="table">
    <tr>
      <th colspan="4" class="tg-center tg-bf">Bokingan Hari Biasa</th>
    </tr>
    <tr>
      <td>Jenis Kamar</td>
      <td>Harga</td>
      <td>Jumlah Kamar</td>
      <td>Jumlah</td>
    </tr>
    <tr>
      <td>Ekonomi</td>
      <td>Rp. 150.000</td>
      <td>5 kamar</td>
      <td>Rp. 750.000</td>
    </tr>
    <tr>
      <td>Standar</td>
      <td>Rp. 200.000</td>
      <td>5 kamar</td>
      <td>Rp. 1.000.000</td>
    </tr>
    <tr>
      <td>Standar AC</td>
      <td>Rp. 300.000</td>
      <td>4 kamar</td>
      <td>Rp. 1.200.000</td>
    </tr>
    <tr>
      <td>VIP/Family</td>
      <td>Rp. 350.000</td>
      <td>1 kamar</td>
      <td>Rp. 350.000</td>
    </tr>
  </table>
</div>
Untuk kode class="tg-center tg-bf" silahkan sesuai dengan keperluan untuk mengatur letak header table.

Keterangan: 
tg-bf untuk huruf tebal 
tg-it untuk huruf miring 
tg-left untuk rata kiri 
tg-right untuk rata kanan 
tg-center untuk rata tengah

Atau cara lain dengan copy-paste dari Exel.
Agar mudah mengakses Anasupar.Com di smartphone, klik ikon 3 titikdi browser Chrome kemudian pilih "Tambahkan ke layar utama". Selanjutnya bisa mengakses Anasupar.Com dari layar utama smartphone dengan klik ikon Anasupar.Com.
Newest Post
Buka Komentar