Penerapan HTML (Part 2)

 I.Latar Belakang.Latar belakang kali ini kita masih mengenal sintag tentang HTML apa saja yang di butuhkan untuk membuat web dasar
II.Alat dan Bahan.

 Laptop / PC
    W3SCHOOLS
    Sublime text


III.Tujuan.

 untuk mengetahui langkah dasar untuk membuat web yang sederhana.
IV.Penjelasan.

HTML Pos

Judul didefinisikan dengan <h1> sampai <h6> tag.

<H1> mendefinisikan heading yang paling penting. <H6> mendefinisikan heading yang paling tidak penting.

Contoh :

Maka outputnya :


Aturan Horizontal HTML

<hr> mendefinisikan istirahat tematik di halaman HTML, dan yang paling sering ditampilkan sebagai aturan horisontal.

<hr> elemen digunakan untuk memisahkan konten (atau menentukan perubahan) dalam sebuah halaman HTML

Contoh :
 Maka outputnya :

HTML <head> Elemen

HTML <head> elemen tidak ada hubungannya dengan judul HTML.

<Head> elemen merupakan wadah untuk metadata. metadata HTML adalah data tentang dokumen HTML. Metadata tidak ditampilkan.

<Head> elemen ditempatkan di antara <html> tag dan <body> tag

Contoh :
Maka outputnya :

Penjelasan : Meta Data adalah suatu sintag yang mendefisinikan bahwa itu
                    program HTML.

HTML Tip - Cara Lihat HTML Sumber

Apakah Anda pernah melihat halaman Web dan bertanya-tanya "Hei! Bagaimana mereka melakukan itu?"

Untuk mengetahui, klik kanan-di halaman dan pilih "View Page Source" (di Chrome) atau "View Source" (di IE), atau serupa di browser lain. Ini akan membuka jendela yang berisi kode HTML halaman.

       tag                                                 Deskripsi
    <Html>                           Mendefinisikan root dari suatu dokumen HTML
    <Body>                           Mendefinisikan tubuh dokumen
    <Head>                          Sebuah wadah untuk semua elemen kepala
                                            (judul,script, gaya,informasi meta, dan banyak lagi)
    <H1> sampai<h6>        Mendefinisikan judul HTML
    <Hr>                               Mendefinisikan perubahan tematik dalam konten

 HTML Paragraf

HTML <p> mendefinisikan sebuah paragraf

Tampilan HTML

Anda tidak bisa yakin bagaimana HTML akan ditampilkan.
Besar atau kecil layar, dan jendela ukurannya akan menciptakan hasil yang berbeda.
Dengan HTML, Anda tidak dapat mengubah output dengan menambahkan spasi ekstra atau baris ekstra dalam kode HTML Anda.
Browser akan menghapus spasi ekstra dan garis ekstra saat halaman ditampilkan.

Contoh :

Maka Outputnya :

 Jangan Lupakan Tag akhir

Kebanyakan browser akan menampilkan HTML dengan benar bahkan jika Anda lupa tag akhir

Contoh : 
 Maka outputnya :


Breaks HTML Baris
HTML Situs elemen mendefinisikan satu baris.

Gunakan <br> jika Anda ingin mengganti baris (baris baru) tanpa memulai sebuah paragraf baru

Contoh : 
 

 Maka outputnya :

<br> tag adalah tag kosong, yang berarti bahwa ia tidak memiliki tag akhir.

Poem Problem

Poem ini akan ditampilkan pada satu baris

 Contoh :

Maka otputnya :
HTML <pre> Elemen

HTML <pre> elemen mendefinisikan teks terformat.

Teks di dalam <pre> elemen ditampilkan dalam font fixed-width (biasanya Kurir), dan mempertahankan kedua ruang dan jeda baris

Contoh :

Maka outputnya :

Ringkasan.

tag                    Deskripsi

<P>               Mendefinisikan sebuah paragraf
<br>              Sisipan satu baris tunggal
<Pre>            Mendefinisikan pre diformat teks

 HTML Styles.

 HTML Style Atribut

Pengaturan gaya elemen HTML, dapat dilakukan dengan atribut style. Atribut style HTML memiliki sintaks berikut:


style="property:value;"

 Properti adalah properti CSS. nilai adalah nilai CSS. 
Catatan : kita akan belajar lebih banyak tentang CSS kemudian dalam tutorial ini.

HTML Warna Background

Properti background-color mendefinisikan warna latar belakang untuk elemen HTML.

Contoh ini menetapkan latar belakang untuk halaman untuk "lightblue".

 Maka outputnya



HTML Warna Teks 
Properti color mendefinisikan warna teks untuk elemen HTML


Contoh :  

 Maka outputnya :



HTML Font 
Properti font-family mendefinisikan font yang akan digunakan untuk elemen HTML

Contoh : 
  
Maka outputnya :

HTML ukuran teks
Properti font-size mendefinisikan ukuran teks untuk elemen HTML 


Contoh : 


Maka outputnya :


HTML Penyelarasan Teks
Properti text-align mendefinisikan perataan teks horisontal untuk elemen HTML

Contoh :

Maka outputnya :


Rangkuman Bab

  •     Gunakan atribut style untuk elemen styling HTML
  •     Gunakan background-warna untuk warna latar belakang
  •     Gunakan warna untuk warna teks
  •     Gunakan font-family untuk font teks
  •     Gunakan font-size untuk ukuran teks
  •     Gunakan text-align untuk perataan teks

V.Kesimpulan.
 
dapat kita simpulkan bahwa trik trik dasar itu harus kita pelajari agar kita dapat membuat suatu web sederhana yang maximal.

VI.Refrensi.


    http://www.w3schools.com/html

Komentar

Postingan Populer