Monday 19 March 2018

Image dan Tables

Berikut cara membuat Tables sekaligus memasukkan Tulisan ataupun Gambar kedalam Tables tersebut.

Pertama Sekali kita buat dulu style css untuk tablenya dengan kode berikut

table, th, td {
    border: 1px solid black;
    border-collapse: collapse;
}
th, td {
    padding: 15px;
    text-align: left;
}
table#t01 {
    width: 100%;   
}

Kemudian untuk kode htmlnya seperti ini

<table>
  <tr>
    <th></th>
    <th></th>
    <th></th>
  </tr>
  <tr>
    <td></td>
    <td></td>
    <td></td>
  </tr>
  <tr>
    <td></td>
    <td></td>
    <td></td>
  </tr>
</table>

Dari kode diatas maka akan terbentuk seperti berikut
Apabila dimasukkan gambar maka akan menjadi



Saturday 17 March 2018

Cara menampilkan kode simbol HTML di postingan Blogger

Berikut cara untuk menampilkan kode simbol HTML di postingan blogger kita.

misalnya kita ingin membuat kode tulisan berjalan seperti dibawah ini

Tulisan Berjalan

kode yang kita kan tidak bisa dilihat orang, yang nampak hanya tulisan yang berjalan saja, tetapi kita ingin memberikan contoh bagaimana membuat tulisan tersebut.
Nah berikut kodenya untuk tulisan berjalan seperti contoh diatas.

<marquee>Tulisan Berjalan</marquee>

Bagaimana cara memberikan contoh tersebut?

Anda bisa menggunakan kode simbol pengganti jika anda paham caranya, namun jika tidak maka anda bisa langsung menuju ke link berikut ini.

Kunjungi link dibawah ini
http://www.blogcrowds.com/resources/parse_html.php

kemudian tulislah kode HTML yang akan kita buat di dalam postingan blog kita lalu tekan tombol "parse".

setelah itu copy kan code tersebut dan paste kedalam postingan blog kita.

Seperti contoh pada postingan blog saya sebelumnya, yaitu;

cara menampilkan image di html

Cara menampilkan image di html

Cara menampilkan image di html

Banyak cara untuk menampilkan image, berikut 3 kode beserta contohnya

<img src="lumba-lumba.gif">
<img src="lumba-lumba.gif" height="25%" width="25%;">
<img src="lumba-lumba.gif" height="300px" width="500px;">

Silahkan dicoba dengan contoh gambar lumba2 diatas.