1 / 23

Tag dan Format Teks

Tag dan Format Teks. Prak . Internet dan Web Rusmala Santi. Penggunaan Tag Dasar. <P> (Page), berguna untuk membuat paragraf baru atau pindah alenia <BR> (Line Break), digunakan untuk pindah ke baris baru

kalin
Download Presentation

Tag dan Format Teks

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Tag dan Format Teks Prak. Internet dan Web RusmalaSanti

  2. Penggunaan Tag Dasar • <P> (Page), bergunauntukmembuatparagrafbaruataupindahalenia • <BR> (Line Break), digunakanuntukpindahkebarisbaru • <NOBR> (No line Break), teks yang ditulissangatpanjangtidaksecaraotomatispindahpadabarisdibawahnya

  3. Contoh: gantibaris.html <HTML> <HEAD> <TITLE>Perbedaangantibarisdanparagraf</TITLE> </HEAD> <BODY> Belajar HTML<P> Sangatmenyenangkanbelajar HTML dan <BR> Kita akanmenjadimahirjikabelajardengan <BR> Sungguh-sungguhdanmencobamencintainya<P> SelamatmencobadanSukses.<BR> </BODY> </HTML>

  4. Membuatgarishorisontal • <HR> (hosiontal) untukmembuatgarishorisontal

  5. Contoh:garis.html <HTML> <HEAD> <TITLE>Perbedaangantibarisdanparagraf</TITLE> </HEAD> <BODY> Belajar HTML<P><HR> Sangatmenyenangkanbelajar HTML dan <BR> Kita akanmenjadimahirjikabelajardengan <BR> Sungguh-sungguhdanmencobamencintainya<P><HR> SelamatmencobadanSukses.<BR><HR> </BODY> </HTML>

  6. Tag Judul (Heading) • Terdapat 6 buah tag: • <H1>…</H1> • <H2>…</H2> • <H3>…</H3> • <H4>…</H4> • <H5>…</H5> • <H6>…</H6>

  7. Contoh: judul.html <HTML> <HEAD> <TITLE>Perbedaangantibarisdanparagraf</TITLE> </HEAD> <BODY> <H1>Belajar HTML</H1> <H2>Sangatmenyenangkanbelajar HTML dan </H2> <H3>Kita akanmenjadimahirjikabelajardengan</H3> <H4>Sungguh-sungguhdanmencobamencintainya</H4> <H5>SelamatmencobadanSukses</H5> <H6>Salam darikuuntuk mu </H6> </BODY> </HTML>

  8. Perataan (Align) • <center> bergunauntukmenempatkandokumentepat di tengahlayar • Atribut ALIGN berfungsiuntukperataandokumen • ALIGN akandiikuti: • “center” untuktengah • “left” untuk rata kiri • “right” untuk rata kanan • WIDTH untukmembuatgarishorixontaldenganpanjangberbeda • SIZE untuktebaltipisnyagaris • NOSHADE garistanpabayangan

  9. Contoh: perataan.html <HTML> <HEAD> <TITLE>Posisiperataandokumen<TITLE> </HEAD> <BODY> <CENTER><H2>PosisiNetral</H2></CENTER> <HR SIZE=5 WIDTH=150> <H4 ALIGN=“left”>Posisi di kiri</H4> <HR SIZE=1 WIDTH=80 ALIGN=“left”> <H3 ALIGN=“center”>Posisi di tengah</H3> <HR SIZE=3 WIDTH=350> <H6 ALIGN=“right”>Posisi di kanan</H6> <HR SIZE=1 WIDTH=80 ALIGN=“right”> <CENTER>ditengahtanpa heading</CENTER> <HR SIZE=4 NOSHADE> </BODY> </HTML>

  10. Format Teks • <B> Bold Text • <I> Italic Text • <U> Underline • <TT> Typewriter • <S> Strikeout • <PRE>Preformatted Text<DFN>Definition • <BLINK>Text berkedip • <STRONG> strong • <CITE> quoting text • <CODE> monospace font • <SAMP> monospace font • <KBD>monospace font • <BIG> ukuranteksakanlebihbesarsatuukuran • <SMALL>ukuranteksakanlebihkecilsatuukuran • <SUP> superscript • <SUB> subscript • <ABBREV> Abbreviations • <ACRONYM>akronim • <PERSON> indexing • <Q> short inline quotation • <VAR>variabel name, italics

  11. Teks Preformat • Biasanyaditerapkanketikasusunandokumendibuatseperti menu • <PRE>…</PRE>

  12. Contoh:preformat.html <HTML> <HEAD> <TITLE>membuat preformat</TITLE> </HEAD> <BODY> <H2>Daftar Menu:</H2> <PRE> Jus Jeruk……………… Rp. 6.000 Jus Tomat……………… Rp. 7.000 Jus Sirsak…………… Rp. 7.000 Jus Mangga…………… Rp. 7.000 Air Es……………………… Rp. 500 ------------------------------------ </PRE> Kami jugamenerimapesanan Jus Campur </BODY> </HTML>

  13. Mengatur Font • <FONT>…</FONT> untukhuruf • Atribut: • SIZE ukuran 1-7 • FACE jenisataunama font • COLOR warna font dengannilai RGB/HEX ataunamawarna

  14. Contoh:jenisfont.html <HTML> <HEAD> <TITLE>Jenis Font</TITLE> </HEAD> <BODY> Iniadalahcontoh font aslidanukuran normal <BR> <FONT FACE=“monotype corsiva”>Ini font Monotype Corsiva</FONT><BR> <FONT FACE=“Arial”>Iniadalah Font Arial</FONT><BR> <FONT FACE=“monotype corsiva” SIZE=“6”>Ini font monotype corsiva size 6</FONT><BR> <FONT FACE=“Arial” SIZE=“5”>ini font arial size 5</FONT><BR> </BODY> </HTML>

  15. Warna font dan background • <FONT> • Atribut: • COLOR untuktulisan • BGCOLOR untukwarnalatarteks

  16. Contoh:jeniswarna.html <HTML> <HEAD> <TITLE>JenisWarna</TITLE> </HEAD> <BODY BGCOLOR=“black” TEXT=“white”> Warnaputih<BR> <FONT COLOR=“gray”>warna gray</FONT><BR> <FONT SIZE=“1” COLOR=“blue”>warna blue</FONT><BR> <FONT SIZE=“2” COLOR=“maroon”>warna maroon</FONT><BR> <FONT SIZE=“3” COLOR=“red”>warna red</FONT><BR> <FONT SIZE=“4” COLOR=“green”>warna green</FONT><BR> <FONT SIZE=“5” COLOR=“#FFFF00”>warna yellow</FONT><BR> <FONT SIZE=“6” COLOR=“#FF00FF”>warna Fuchsia</FONT><BR> </BODY> </HTML>

  17. EntitasKarakterdanNumerik • Dokumen yang berupakarakterdannumerikjugabisadibentuksesuaidengansimbol-simboltertentu

  18. Contoh:charkhusus.html <HTML> <HEAD> <TITLE>KarakterKhusus</TITLE> </HEAD> <BODY> <H2>Tentang Microsoft</H2> NamaMicrosoft&reg&nbsp&nbsp&nbsp;terdapatversi&nbsp;&szlig; </BODY> </HTML>

  19. Mengaturdaftar item • <UL> jikatanpaadatambahan tag lain makafungsinyahampirseperti tag <PRE> • Jikaditambah <LI> akanadatambahantandabulatan (bullet) • Atribut TYPE untukmendefinisikanbentuk bullet <UL COMPACT TYPE=square> • 1: default number, 1, 2, 3 • A:Huruf besar,A,B,C • a:huruf kecil,a,b,c • I:huruf romawibesar, I, II, III • i: hurufromawikecil, i, ii, iii

  20. Contoh:bullet.html <HTML> <HEAD> <TITLE>membuat bullet</TITLE> </HEAD> <BODY> <H2>Daftar Menu:</H2> <UL> <LI>Jus Jeruk……………… Rp. 6.000<BR> <LI>Jus Tomat……………… Rp. 7.000<BR> <LI>Jus Sirsak…………… Rp. 7.000<BR> <LI>Jus Mangga…………… Rp. 7.000<BR> <LI>Air Es……………………… Rp. 500<BR> ------------------------------------ </UL> Kami jugamenerimapesanan Jus Campur </BODY> </HTML>

  21. <OL> jikamenginginkan no urut • <DL> • <DT> • <DD>

  22. Contoh:nourut.html <HTML> <HEAD> <TITLE>membuat bullet</TITLE> </HEAD> <BODY> <H2>Daftar Menu:</H2> <OL> <LI>Jus Jeruk……………… Rp. 6.000<BR> <LI>Jus Tomat……………… Rp. 7.000<BR> <LI>Jus Sirsak…………… Rp. 7.000<BR> <LI>Jus Mangga…………… Rp. 7.000<BR> <LI>Air Es……………………… Rp. 500<BR> ------------------------------------ </OL> Kami jugamenerimapesanan Jus Campur </BODY> </HTML>

  23. Contoh:zigzag.html <HTML> <HEAD> <TITLE>Membuatdaftarsecara zigzag</TITLE> </HEAD> <BODY> <DL> <DT>item pertama. <DD>penjelasantentang item pertama. <DT>item kedua. <DD>penjelasantentang item kedua. </DL> </BODY> </HTML>

More Related