Perintah dan Fungsi Tag pada HTML

Slides:



Advertisements
Presentasi serupa
Matakuliah Pengenalan Internet
Advertisements

Image – Hyperlink – Form
Cascading Style Sheet Gufron Gufron - Sub Bahasan • Pendahuluan • Konsep Dasar CSS • Syntax/Perintah CSS • Implementasi.
Pengembangan Web Pertemuan 2 HTML Basic (Text Formating, Link & Frame)
FONT PADA HTML OLEH :Yuni Wahyuni. Font Pada Html Dimana kita ketahui font adalah Tulisan, Sedangkan pada Html adalah untuk mengubah format di html pada.
HTML PEMROGRAMAN INTERNET. Form & Input HTML Form adalah area yang bisa ditempati oleh elemen form. Elemen form adalah elemen yg mengijinkan user memasukkan.
Cascading Style Sheets (CSS)
STMIK PPKIA Pradnya Paramita
DASAR HTML Marina Azizah. Struktur Dokumen HTML Dokumen HTML bisa di bagi mejadi tiga bagian utama: HTML Setiap dokumen HTML harus di awali dan di tutup.
Reza Sulistyawan, S.Kom Pemrograman Web 1 1 Frame Frame memungkinkan satu halaman Web atau lebih ditampilkan pada sebuah jendela browser Halaman yang berbasis.
MENGOPERASIKAN APLIKASI PRESENTASI
Apa itu HTML ? Perangkat lunak yang digunakan untuk membuat atau mengetikkan kode file HTML Perangkat lunak yang digunakan untuk menjalankan atau menampilkan.
Belajar HTML Lanjut 2 TIK Fajar Harapan. Membuat Tabel Membuat tabel dalam html  untuk membuat Baris  untuk membuat Cell  untuk membuat header.
PEMROGRAMAN WEB (IS 222) - PERTEMUAN 1-
Pertemuan 9 Cascading Style Sheet (css)
BELAJAR POWER POINT.
Dasar CSS A’ud Solehuddin::Februari2012. Materi Mengenal CSS Mengenal CSS Mencoba CSS Mencoba CSS Penggunaan atribut ID dalam tag Penggunaan atribut ID.
Pemrograman web dasar TABEL.
Bahasa HTML Dasar.
Pemprograman & Perancangan WEB Pertemuan 6  CSS (Cascading Style Sheet)
CSS.
HTML (Hypertext Markup Language)
Pemrograman Web Mohamad Syafri Tuloli.
HTML Achmad Yasid,SKom. HTML Singkatan dari HyperText Markup Language adalah bahasa yang menjelaskan bagaimana suatu teks, video, grafik, animasi dan.
HTML Referansi Tag HTML.
Pemrograman Web HTML (1) Andy Haryoko, ST.
HTML PEMROGRAMAN INTERNET.
TABEL , FORM DAN FRAME.
Pemprograman BaSIS Web
FORM dan FRAME.
ADD-ON Dasar HTML.
FORM Kegunaan Form : memperoleh data-data user baik nama, alamat dan data lainnya untuk mendaftar pada service yang di sediakan. memperoleh informasi pembelian.
CSS (Cascading Style Sheet)
CSS Eksternal & Style Elemen
Pertemuan 2 1.  Bahasa yang digunakan untuk menampilkan informasi pd halaman web.  bahasa ini menggunakan tanda (markup) untuk menandai perintah- perintahnya.
Dasar-dasar HTML Mengenal HTML
Formatting Frame.
Desain Web dengan Tag HTML
IRAWATI, S.Kom.,MT. PEMROGRAMAN WEB
MATERI PERKULIAHAN REKAYASA PERANGKAT LUNAK DISUSUN OLEH : KRISTIAWAN NUGROHO, M.KOM Fakultas Kesehatan.
FORM HTML Oleh : Fajar Y. Zebua.
STMIK PPKIA Pradnya Paramita Pemrograman berbasis Web
PERTEMUAN 2 HTML (Lanjutan).
PERTEMUAN CSS Pengenalan CSS.
B. Membuat Dokumen Baru.
HTML PEMROGRAMAN INTERNET.
DASAR-DASAR HTML Efek Karakter Fisik KOMPUTER APLIKASI IT – I Oleh :
HTML.
Komputer aplikasi it-I (html)
Mengenal dan Teknik Pembuatan Frame
Internet dan Pengantar HTML
Adi Rachmanto – UNIKOM T A B E L Komputer aplikasi iT-1 Adi Rachmanto – UNIKOM
Mengenal dan Teknik Pembuatan Frame
Comand Prompt Oleh: Oktapiyanti.
Komputer aplikasi it-I (html)
Modul 2 : Dasar-dasar HTML (1)
INTERNET (Praktikum) STMIK “BINA NUSANTARA JAYA”
PJ : Nuraini Purwandari
T A B E L.
Komputer aplikasi it-I (html)
Pemrograman Basis Data Berbasis Web
Pertemuan 2 HTML Basic (Text Formating, Link & Frame)
LPIA Cileungsi Team Div-Kom ‘10
Darmawan satyananda Mathematics department State university of malang
FRAME Pada HTML STMIK – AMIK Jayanusa. A. Frameset dan Frame Frameset adalah sebuah tag untuk pendefenisan pembuatan frame ( ) Frame adalah teknik yang.
FORM HTML.
STMIK PPKIA Pradnya Paramita Pemrograman berbasis Web
Pertemuan 2 HTML Basic (Text Formating, Link & Frame)
List dan Image pada HTML
Pertemuan 2 HTML Basic (Text Formating, Link & Frame)
Transcript presentasi:

Perintah dan Fungsi Tag pada HTML SRI WAHYUNINGSIH 102904015 PTIKC

<H1> Sampai <H6> Fungsi  : untuk membuat (memilih) ukuran teks. Sintak  : <H1>             </H1> Contoh <HTML> <HEAD><TITLE>Contoh Heading</TITLE></HEAD> <BODY> <H1> Teks dengan Heading 1</H1> <H2> Teks dengan Heading 2</H2> <H3> Teks dengan Heading 3</H3> <H4> Teks dengan Heading 4</H4> <H5> Teks dengan Heading 5</H5> <H6> Teks dengan Heading 6</H6> </BODY> </HTML>

<HR> Fungsi : perintah untuk membuat garis horizontal penuh layar cth : ----------------------------------------------------

<I> Perintah ini digunakan untuk membuat teks miring. Sintaks            : <I>    </I> Contoh <HTML> <HEAD><TITLE>     </TITLE></HEAD> <BODY>   <I> Selamat Datang Ke Websiteku</I> </BODY> </HTML>

<B> Perintah ini digunakan untuk membuat teks tebal. Sintaks : <B>   </B> Contoh <HTML> <HEAD><TITLE>     </TITLE></HEAD> <BODY> <B> Selamat Datang Ke Websiteku</B> </BODY> </HTML>

<U> Perintah ini digunakan untuk membuat teks bergaris bawah. Sintaks            : <U>   </U> <HTML> <HEAD><TITLE>     </TITLE></HEAD> <BODY> <U> Selamat Datang Ke Websiteku</U> <U><B> Selamat Datang Ke Websiteku</U></B> </BODY> </HTML>

<CENTER> Perintah ini untuk membuat teks ke tengah layar. Sintaks            : <CENTER>  </CENTER> Contoh            : <HTML> <HEAD><TITLE>     </TITLE></HEAD> <BODY> <H1><CENTER> Selamat Datang Ke Websiteku</CENTER></H1> </BODY> </HTML>

<ALIGN> Fungsi : Membuat teks rata kiri dan rata kanan Sintak : <P ALIGN=right>untuk rata kanan <P ALIGN=left>untuk rata kiri <P ALIGN=center>untuk rata tengah <P ALIGN=justify>untuk rata kiri dan rata kananatau<H?ALIGN=right> <H?ALIGN=left> <H?ALIGN=center> <H?ALIGN=justify>Contoh pemakaian: <H2 Align=right>Selamat Datang Ke Website Kami <H2>

<BR> (Line Break) Perintah ini digunakan untuk memasukan fungsi Enter. Sebagai contoh, jika perintah <BR> diberikan di akhir baris, maka kalimat berikutnya akan dicetak pada baris berikutnya.

<BR> Fungsi : memasukkan fungsi enter Cth : Jika perintah <BR> diberikan di awal atau diakhir baris, maka kalimat berikutnya akan dicetak pada baris   berikutnya

<!– Perintah untuk membuat KOMENTAR. Semua teks atau perintah yang diapit perintah ini tidak akan dijalankan. Ini hanya komentar untuk program. Sintaks            : <!–    –> Contoh            : <!—Ini adalah contoh komentar –>

<BASEFONT> Fungsi : Mengubah ukuran font Contoh : <BASEFONT SIZE=6> WELCOME TO MY WEBSITE <B>WELCOME TO MY WEBSITE DAN TEBAL</B>

<SUP> Fungsi : membuat cetak naik suatu teks Contoh : Kami adalah yang pertama:1stin the world

<SUB> Fungsi : membuat suatu teks cetak turun Contoh : contoh-contoh teks cetak turun : H2O (Disebut Air) dan C2127No (Disebut Methadon)

<LI> Fungsi : juga untuk membuat bullet Catatan : perintah <LI> harus berada dalam perintah OL,UL,DIR,Menu Contoh : <UL> <LI> <H2> Jawa Timur </H2> <UL> <LI> SURABAYA </LI> <LI> MALANG </LI> <LI> GRESIK </LI> </UL> </LI> </BR> <LI> <H2> Jawa Barat </H2> <UL> <LI> Bandung </LI> <LI> Sukabumi </LI> <LI> Bogor </LI> </UL> </LI> </UL>

<IMGSRC> Fungsi : memasukkan gambar ke dalam Website Anda dapat juga memasukkan gambar berakhiran *.Jpg, *.Gif, *.Bmp dll Sintak :<IMG BORDER=”5″> “5″ merupakan ukuran border(Bingkai), ganti angka ini sesuai keinginan anda

<BGSOUND> Fungsi : memasukkan suara atau musik ke dalam Website Sintak : <BGSOUND loop=infite src=”d:/Selamat datang.WAV”>

FACE Untuk mengubah jenis font Contoh : <HTML> <HEAD><TITLE> </TITLE> </HEAD> <BODY> <FONT SIZE =”6” FACE=”Times New Roman”> Teks dengan jenis font Times New Roman. <FONT SIZE =”6” FACE=”Arial”> Teks dengan jenis font Arial. </BODY> </HTML>

Indenting Text Tag <BLOCKQUOTE> yaitu teks yang menjorok lebih kedalam dari garis tepi secara otomatis dari kiri ke kanan. Cobalah contoh berikut : <BLOCKQUOTE> You can use Sound Recorder to record, play, and edit sound files. To use Sound Recorder, you must have a sound card and speakers installed on your computer. If you want to record live sound, you also need a microphone. </BLOCKQUOTE>

Penerapan Definisi ListDefinisi List adalah serupa dengan daftar kata Penerapan Definisi ListDefinisi List adalah serupa dengan daftar kata. Diterapkan menggunakan tag <DL> dan <DT> seperti ditunjukkan listing dibawah ini : <DL> <DT>Java <DD>Developed by Sun Microsystems Inc <DT>Yang kedua <DD>Developed by saya sendiri </DL>

Link dengan sorot Berikut adalah contoh program bagaimana membuat link hanya dengan sorot saja (link tak perlu diklik, tetapi cukup disorot dengan mouse. <HTML> <HEAD> <TITLE> </TITLE> <META Name=”description”Content=” “> <META Name=”keywords”Content=” “> <META Name=”generator”Content=”Cute HTML”> </HEAD> <BODY BG Color=”#FFFFFF”Text=”#000000=”#”0000FF”VLink=”#800080″> <Center> <A href=” “target=main on mouse over=”Window.open(‘c:/html/keterangan.html’):”> <Font Size=3 FACE=Arial Color=#804000> Keterangan </FONT> </e> </CENTER> </BODY> </HTML>

Link dengan tombol Berikut adalah contoh program link dengan tombol Sintak : <Input type=”button”Value=”Nama Tombol” On Click=”parent.location=”Link anda disini” >

< /HEAD > < BODY BGCOLOR=”#FFFFFF”Text=”#000000″Vlink=”#800080″ > < Center > < h1 > PT.OCTA > < Input Type=”button”value=”Tentang Kami” on click=”parent.location=”c:/website/tentang_kami.html’” > < Input Type=”button”value=”Produk Kami” on click=”parent.location=”c:/gambar/produk_kami.html’” > < Input Type=”button”value=”cara memesan” on click=”parent.location=”c:/gambar/cara_memesan.html’” > < /Center > < /Body > < /HTML > Contoh Buatlah link dengan nama tentang_kami.html produk_kami.html cara_memesan.html < HTML > < HEAD > < TITLE > </TITLE> < META name=”description”Content=” “> < META name=”keywords”Content=” “> < META name=”generator”Content=”Cute HTML”>

Membuat Frame -Framecols : membagi layar dalam bentuk kolom -FrameRows : membagi layar dengan bentuk baris -Frame Src : menampilkan file dalam frame Bentuknya (Frame cols=”30%,*”) (Frame src=”Nama.file Name=”Teks”) (Frame Rows=”40%,*”) (Frame src=”Nama.file”Nama=”teks”) (Frame src=”Nama.file”Nama=”Teks) (/Frameset)

Contoh Program Frame < Html > < Head > < Title >Melink dengan sorot < /Title > < /Head > < Frameset cols=”30%,*” > < Frame src=”Nama file”Nama=”Teks” > < Frame Rows=”40%%,*” > < Frame src=”Gambar File’Nama=”Gambar” > < Frame src=”Nama File”Nama=”Teks > < /Frameset >

<LABEL> </LABEL> Adalah suatu perintah untuk membuat keterangan field (kotak input) dalam pembuatan form, dan umumnya digunakan dengan perintah INPUT. Sedangkan LABEL terdiri dari beberapa atribut : ACCESSKEY=character Tombol shortcut. ONFOCUS=script Elemen yang menerima fokus (kursor) ONBLUR=script Elemen yang ditinggalkan fokus (kursor).  

Contoh : <HTML> <HEAD> <TITLE></TITLE> </HEAD> <BODY BGCOLOR=”#FFFFFF” TEXT=”#000000″ LINK=”#0000FF” VLINK=”#800080″> <p> <label accesskey=U>Nama Anda : <input type=”text” name=”username” size=”20″ maxlength=”15″></label> </p> <label accesskey=P>Password : <input type=”password” name=”pw” size=”20″ maxlength=”20″></label> </BODY> </HTML>

FONT COLOR Perintah untuk memasukan warna kedalam teks. Contoh : <HTML> <HEAD> <TITLE></TITLE> </HEAD> <BODY BGCOLOR=”#FFFFFF” TEXT=”#000000″ LINK=”#0000FF” VLINK=”#800080″> <basefont size=”6″> <b> <font color=”red”>Teks dengan warna merah</font><br> <font color=”black”>Teks dengan warna hitam</font><br> <font color=”blue”>Teks dengan warna biru</font> </b> </BODY> </HTML>

BACKGROUND #ff00ff : Fuchsia #008000 : Green #00ff00 : Lime Adalah perintah untuk membuat warna latar belakang sebuah teks. KODE-KODE WARNA UNTUK WARNA BACKGROUND #000000          : Black #c0c0c0           : Silver #808080          : Gray #ffffff             : White #800000          : Maroon #ff0000           : Red #800080          : Purple #ff00ff              : Fuchsia #008000          : Green #00ff00           : Lime #808000          : Olive #ffff00            : Yellow #000080          : Navy #0000ff           : Blue #008080          : Teal #00ffff              : Aqua

Contoh : <HTML> <HEAD> <TITLE></TITLE> </HEAD> <BODY BGCOLOR=”#FFFFFF” TEXT=”#000000″ LINK=”#0000FF” VLINK=”#800080″> <table cellpadding=”5″ cellspacing=”5″> <td style=”BACKGROUND: #000000; COLOR: white”>Dasar Hitam </td> <td style=”BACKGROUND: #ff0000; COLOR: white”>Dasar Merah </td> </table> </BODY> </HTML>

IFRAME SRC Adalah perintah untuk membuat jendela dengan lebar dan tinggi sesuai dengan keinginan programmer, dan dapat diletakan di bagian kiri, tengah, atau bagian kanan.   Sintaks : <IFRAME SRC=”link” WITDH=400 HEIGHT=105></IFRAME>

Contoh : <HTML> <HEAD> <TITLE></TITLE> </HEAD> <BODY BGCOLOR=”#FFFFFF” TEXT=”#000000″ LINK=”#0000FF” VLINK=”#800080″> <p align=”center”> <iframe src=”link” WIDTH=400 HEIGHT=90> </iframe> </p> <img src=”link”></p> </BODY> </HTML>

A HREF <A HREF Adalah perintah HTML untuk membuat LINK (membuka sebuah halam atau URL dari sebuah halaman). Ada pun atribut yang dapat digunakan dengan HREF adalah sebagai berikut: ONCLICK : Membuka link setelah tombol di-klik ONMOUSEOVER : Membuka link hanya dengan menyorot tombol ONMOUSEOUT : Membuka link hanya dengan menyorot tombol, dan kembali kehalaman semula apabila mouse dijauhkan dari link. Sintaks: <A HREF=”gambar atau halaman atau URL”> Nama Link</A>