Cara Membuat Tabel di HTML

Cara Membuat Tabel di HTML

contoh tabel html

Salah satu cara atau format menampilkan informasi dalam web adalah dengan tabel.

Tabel terdiri dari 4 unsur utama:

    1. Baris

    2. Kolom

    3. Sel

    4. Garis

Lalu, bagaimana cara membuat tabel di HTML?

Kita bisa membuatnya dengan beberapa tag yang sudah disediakan di HTML.

Tag Untuk Membuat Tabel di HTML

Ada beberapa tag yang harus diingat untuk membuat tabel di HTML:

Tag <table> untuk membungkus tabelnya

Tag <thead> untuk membungkus bagian kepala tabel

Tag <tbody> untuk membungkus bagian body dari tabel

Tag <tr> (tabel row) untuk membuat baris

Tag <td> (table data) untuk membuat sel

Tag <th> (table head) untuk membuat judul pada header

Tag yang paling penting untuk diingat adalah tag <table>, <tr>, dan <td>. Sementara tag yang lain adalah tambahan (opsional), boleh digunakan boleh tidak.

Contoh Tabel HTML :

Hasilnya :

Element Pada Tabel HTML

Element TABLE befungsi untuk membuat suatu data multidimensi yang terdiri atas kolom dan baris. Element ini mempunyai attribute seperti align, bgcolor, border, cellpadding(jarak antara tepi sel dengan isi sel), cellspacing(jarak antara sel), width(lebar tabel), height(tinggi tabel). Element TABLE berisikan element CAPTION, TH, TR dan TD.

Element Caption

Element CAPTION berfungsi untuk membuat judul dari tabel. Element ini harus berada di dalam element TABLE dan mempunyai attribute align dengan nilai top(judul terletak di atas tabel), dan bottom(judul terletak di bawah tabel).

Sintaks:

<caption  align="top"|"bottom">

      ..........................

</caption>

Element TR (Table Row)

Element TR mendefinisikan baris pada tabel dan element ini harus berada di dalam element TABLE. Pada element TR terdapat element TH dan TD. Attribute yang terdapat pada element ini adalah align, valign(posisi vertikal), dan bgcolor.

Element  TH (Table Header) dan TD (Table Data)

Element TH dan TD merupakan informasi pada tabel. TH mendefinisikan isi sel sebagai header sel pada kolom tabel dan datanya tercetak tebal dan dengan posisi ditengah sel. Element TH dan TD ini harus terletak di dalam element TR. Attribute kedua element ini adalah align, valign, bgcolor, colspan, rowspan

 Baca Juga :

• Latihan Tabel Pada HTML
• Pengenalan Dasar HTML         

Share:

Read More

LATIHAN TABEL HTML

LATIHAN TABEL HTML

Nama                : GLENDY RONGKO

Nim                   : 18208040

Mata Kuliah    :  PEMOGRAMAN WEB

Hasil Program :

Hasil Program :

Hasil Program :

Hasil Program :

Hasil Program :

Membuat WEB Sederhana

Hasil Program :

Baca Juga :

• Cara membuat Tabel HTML
• Pengenalan Dasar HTML         

Share:

Read More

Pengenalan JavaScript Part 1

Javascript adalah bahasa pemrograman yang wajib kamu pelajari jika ingin mendalami dunia web development.

Saat ini javascript tidak hanya digunakan di sisi client (browser) saja. Javascript juga digunakan pada server, console, program desktop, mobile, IoT, game, dan lain-lain.

Apa itu javascript?

Javascript adalah bahasa pemrograman yang awalnya dirancang untuk berjalan di atas browser.

    Namun, seiring perkembangan zaman, javascript tidak hanya berjalan di atas browser saja. Javascript juga dapat digunakan pada sisi Server, Game, IoT, Desktop, dsb.

    Javascript awalnya bernama Mocha, lalu berubah menjadi LiveScript saat browser Netscape Navigator 2.0 rilis versi beta (September 1995). Namun, setelah itu dinamai ulang menjadi Javascript. 1 Terinspirasi dari kesuksesan Javascript, Microsoft mengadopsi teknologi serupa. Microsoft membuat ‘Javascript’ versi mereka sendiri bernama JScript. Lalu di tanam pada Internet Explorer 3.0.

    Hal ini mengakibatkan ‘ perang browser’, karena JScript milik Microsoft berbeda dengan Javascript racikan Netscape.

    Akhirnya pada tahun 1996, Netscape mengirimkan standarisasi ECMA-262 ke Ecma International. Sehingga lahirlah standarisasi kode Javascript bernama ECMAScript atau ES. Saat ini ECMAScript sudah mencapai versi 8 (ES8).

Peralatan untuk Belajar Javascript

Apa saja perlatan yang harus disiapkan untuk belajar Javascript?

        1. Web Browser (Google Chrome, Firefox, Opera, dll

        2. Teks Editor (rekomendasi: VS Code)

Mengenal Console JavaScript

    Ada yang mengatakan, belajar javascript itu susah, karena saat melihat hasilnya di web browser, pesan error-nya tidak tampil. Pendapat ini tidak benar. Karena kita bisa melihatnya melalui console.

Console Javascript dapat kita buka melalui Inspect Element->Console.

Di dalam console, kita bisa menulis fungsi atau kode-kode javascript dan hasilnya akan langsung ditampilkan.

Fungsi JavaScript

    Fungsi utama dari JS yaitu membuat suatu website lebih interaktif dan lebih menarik. JS adalah bahasa pemrograman yang script nya dijalankan di browser perangkat pengguna, berbeda dengan bahasa pemrograman lain yang scriptnya dijalankan oleh server.

  Baca Juga :

            Pemograman Web Latihan Soal

Perbedaan JavaScript dengan Bahasa Pemograman Lainnya

    Perbedaan yang akan dibahas yaitu perbedaan antara javascript, HTML, CSS, dan PHP. Pertama adalah javascript atau bisa disingkat dengan JS. Fungsi utama dari JS yaitu membuat suatu website lebih interaktif dan lebih menarik. 

JS adalah bahasa pemrograman yang script nya dijalankan di browser perangkat pengguna, berbeda dengan bahasa pemrograman lain yang scriptnya dijalankan oleh server. Untuk menyediakan kebergunaan tingkat lanjut, para developer biasanya tidak harus melakukan coding dari awal karena biasanya JS akan masuk ke library pihak ketiga.

    Untuk HTML atau Hyper Text Markup Language, anda pasti sudah tahu bahwa bahasa satu ini seringkali digunakan di website dan menjadi building block dari suatu halaman website. Bagi yang memiliki website pasti tahu tag html <img> untuk gambar, tag <p> untuk paragraf, dan masih banyak lainnya.

    Sedangkan untuk CSS atau Cascading Style Sheets sering digunakan untuk mengatur style dan menentukan tampilan suatu konten. Dalam HTML, untuk menampilkan suatu konten, memerlukan perlakuan manual untuk setiap elemennya sedangkan dalam CSS tidak. Anda tidak perlu menentukan tampilan elemen-elemen berungkali.

Share:

Read More

Belajar HTML Part 1 - Pengenalan Dasar HTML

Hay Guys kali ini saya akan berbagi ilmu tentang HTML....

HTML memang bahasa yang wajib dipelajari, bagi yang mau menjadi seorang developer.

Karena

HTML adalah bahasa dasar untuk membuat web.

Apa Itu HTML ?

Menurut Wikipedia :

Hypet Text Markup Language (HTML) adalah bahasa Markah standar untuk dokumen yang dirancang untuk di tampilkan di peramban web.

Jadi, HTML itu adalah sebuah bahasa yang menggunakan markup atau penanda untuk membuat halaman web. 

Penanda atau markup ini, nanti akan kita sebut dengan Tag. 

HTML berperan untuk menentukan struktur konten dan tampilan dari sebuah web.

Dalam membuat halaman web, HTML tidak sendirian. Ada bahasa lain lagi yang menjadi pelengkapnya, yakni CSS dan Javascript.

CSS adalah bahasa khusus yang digunakan untuk memperindah tampilan web.

Lalu Javascript bertugas untuk membuat halaman web menjadi hidup. Karena dengan Javascript, kita dapat menentukan fungsi-fungsi maupun efek yang akan diterapkan di website.

Perkembangan dan Versi HTML

HTML punya beberapa versi, dari versi yang paling tua hingga yang terbaru. Berikut ini perkembangan versi HTML:

• [Draft] HTML 1.0 (Juni 1993) adalah versi HTML pertama, namun tidak resmi dirilis;
• HTML 2.0 (24 November 1995) adalah versi HTML kedua yang resmi pertamakali beredar di pasaran dan dirilis oleh IETF;
• [Draft] HTML 3.0 (28 Maret 1995) versi ini gagal beredar, karena banyak perubahan yang memicu perdebatan;
• HTML 3.2 (14 Januari 1997) versi resmi yang dirilis W3C pertamakali.
• HTML 4.0 (24 April 1998) versi pengembangan dari yang seblumnya;
• HTML 4.01 (24 Desember 1999) versi perbaikan dari HTML 4.0;
• XHTML 1.0 (26 Januari 2000) pengembangan dari HTML 4.01 dengan mengadopsi XML;
• XHTML 2.0 (Augustus 2002—Juli 2006) versi kedua dari XHTML;
• HTML 5 (28 Oktober 2014) versi html saat ini.

Struktur Dasar HTML

Struktur dasar HTML terdiri atas 3 Bagian :

1. Bagian Deklarasi

2. Bagian Head

3. Bagian Body

Contoh Program HTML Sederhana

Berikut ini adalah contoh-contoh program html sederhana :

1. Penulisan HTML Dasar 1

Hasil Program :

2. Membuat tag <li></li> Di HTML

Code Program :

Hasil Program :

3. Membuat Form di HTML

Code Program :

Hasil Program :

4. Membuat tag Gambar HTML

Code Program :

Hasil Program :

5. Membuat Menu HTML

Code Program :

Hasil Program :

Share:

Read More

Input dan Output Standar C++

Pengertian dan Contoh Input & Ouput Standar C++

input dan output program  c++

Tutorial C++ Input dan Output part 2

Hallo jumpa lagi dengan saya Glen Alvaro, kali ini saya akan share tentang belajar Input dan Output Standar dalam C++. Setelah kita belajar tentang Struktur Program C++ maka kita akan lebih muda memahami tentang input dan output di program C++. 

dalam C++, iostream juga mendukung dua operasi yaitu cout untuk output dan c i n untuk input. Biasanya perintah COUT akan menampilkan sesuatu ke layar monitor dan perintah c i n akan menerima masukan dari keyboard.

1. Contoh program C++ Output (cout)

untuk cout menggunakan operator << (insertion operation)

    cout<<" Hello World"; //mencetak tulisan Hello World ke layar monitor

    cout<<40;                    //mencetak angka 40 ke layar

    cout<<x;                      //mencetak isi nilai variabel x ke layar

Operator (<<) dikenal dengan insertion operator yang memberikan perintah kepada cout.

• untuk contoh pertama, kalimat yang akan dicetak di layar diapit oleh tanda " " karena berupa string.
• sedangkan pada contoh kedua dan ketiga, tanpa tanda " ", karena yang akan di tampilkan ke layar berupa string ataupun karakter.

insertion operator (<<) dapat digunakan lebih dari satu dalam sebuah pernyataan misalnya :

cout<<"hallo"<<"saya glen"<<"belajar C++";

dan dapat juga di kombinasikan dengan varriabel, contohnya :

cout<<"hallo saya berusia"<<age<<"tahun";

ket : untuk memakai perintah ganti baris, ada dua perintah yang bisa dipakai :

"/n" dan perintah endl

Baca Juga :

           Struktur Program bahasa C++

2. Contoh program C++ input (c i n)

untuk menerima inputan dari keyboard dengan perintah c i n, maka operator digunakan adalah overloaded operator (>>) dan di ikuti dengan variabel tempat menyimpan inputan data.

contoh :

int age;

cin>>age;

c i n hanya dapat di proses setelah penekanan tombol ENTER, jadi walaupun hanya satu karakter yang di masukkan, sebelum penekanan enter, c i n tidak akan merespon apa-apa.

itulah sedikit penjelasan tentang Input dan Output pada program C++, semoga bermanfaat. dan JANGAN LUPA TITIK KOMA (;).

Share:

Read More

Struktur Program Bahasa C++

Pengenalan Struktur Program Bahasa C++

struktur program c++

Struktur Program Bahasa C++

Hallo jumpa lagi dengan saya Glen Alvaro, kali ini saya akan share tentang Struktur Program Bahasa C++. Bagi kalian yang ingin belajar C++ dari awal ini adalah artikel yang tepat untuk kalian belajar pemograman khususnya Bahasa Pemograman C++. Oke langsung saja berikut adalah contoh program C++ :

//program pertama

#include<iostream.h>

using namespace std

int main()

{

       cout<<"Hello world";

}

Jika sudah di ketik, simpan program diatas misalnya dengan nama latih.cpp

Tekan tombol Alt+F9 untuk mengkompile program (compile program), jika status dinyatakan sukses, dan tidak ada pesan error maka tekan CTRL+F9 untuk menjalankan program tersebut (run program).

Keterangan :

• //program pertama

Merupakan sebuah baris komentar. Semua baris yang di tandai dengan tanda slash(//), akan di anggap sebagai baris komentar dan tidak akan berpengaruh pada program. Biasanya, baris komentar dipakai oleh programmer untuk memberikan penjelasan tentang program. Ada dua baris komentar pada C++ yaitu :

//baris komentar

/*blok komentar*/

• #include<iostream.h>

Pernyataan yang diawali dengan tanda (#) merupakan pernyataan pre-processor. Pernyataan ini bukan untuk di eksekusi program #include<iostream.h> berarti memerintahkan compiler untuk menyertakan file header iostream.h. dalam file header ini terdapat beberapa fungsi standar yang di pakai dalam proses input dan ouput(cin dan cout).

• using namespace std

using namespace std adalah salah satu instruksi yang dapat kita berikan kepada aplikasi compiler terkait penggunaan fungsi dalam sebuah kerangka yang sama.

• int main()

Int main adalah baris dimana compiler akan mengeksekusi program. Atau pernyataan main sebagain penanda program utama. main diikuti oleh tanda kurung ( ), karna main merupakan sebuah fungsi, dan sebuah fiungsi dalam C++ harus diikuti dengan tanda ( ), yang nantinya dapat berisi sebuah argument.

• {    }

isi dari sebuah fungsi harus diawali dengan buka kurung kurawal {, dan di akhiri dengan tutup kurung kurawal (}).

• cout <<"Hello world";

Perintah ini merupakan hal yang akan dieksekusi oleh compiler dan perintah yang akan di kerjakan. cout yaitu menampilkan program ke layar.

Setiap pernyataan dalam C++ harus diakhiri dengan titik koma(;), untuk memisahkan satu pernyataan dengan peryataan lainnya.

• Return 0;

Pernyataan ini akan menyebabkan fungsi main menghentikan program dan mengembalikan nilai kepada main. Dalam hal ini yang akan di kembalikan adalah nilai 0.

Baca Juga :

           Input dan Output Program C++

Contoh program pernyataan Return 0;

//latihan kedua

#include<iostream.h>

using namespace std

int main()

{

      cout<<"Belajar C++";

      cout<<"untuk pemula";

      return 0;

}

Itulah sedikit penjelasan mengenai Struktur Program Bahasa C++, semoga Bermanfaat. dan Lupa titik koma.

Share:

Read More