PEMROGRAMAN WEB I
Oleh:
I Wayan Simpen
By I Wayan Simpen
Agenda
• Font & CSS
• Frame
By I Wayan Simpen
Font
• Atribut Tag Font
Atribut Kegunaan
Size=“n” Menentukan ukuran font
sebesar n (n=1..7)
Size=“+n” Me...
By I Wayan Simpen
Contoh:
• Penggunaan <Font Size=“”>
<BODY>
<FONT SIZE=1>FONT SIZE=1</FONT><br>
<FONT SIZE=2>FONT SIZE=2<...
By I Wayan Simpen
Hasil
By I Wayan Simpen
Menggunakan Font Color
<HTML>
<BODY BGCOLOR="SILVER">
<FONT SIZE=1>FONT SIZE=1</FONT><br>
<FONT SIZE=2 C...
By I Wayan Simpen
Hasil
By I Wayan Simpen
Menggunakan <Font face=“”>
<BODY BGCOLOR="SILVER">
<FONT SIZE=6>
<FONT face="Arial Black">Font Arial
Bal...
By I Wayan Simpen
Hasil
By I Wayan Simpen
Contoh Lain
<body bgcolor="silver">
<p><FONT face="Tahoma" size="6" color="red">
Apakah dokumen HTML itu...
By I Wayan Simpen
<p><FONT face="Time New Roman" Color="Blue">
Adalah dokumen yang tampil dalam Web, dimana
semua orang da...
By I Wayan Simpen
Hasil
By I Wayan Simpen
CSS
• CSS (Cascade Style Sheet) merupakan
fitur baru dari HTML hal ini diperlukan
agar manajemen pages m...
By I Wayan Simpen
Jenis CSS
CSS
CSS Internal
CSS External
CSS in Line
By I Wayan Simpen
CSS Internal<HTML>
<HEAD>
<style>
body {background-color:silver}
h1 {color : red}
h2 {color : blue}
p {f...
By I Wayan Simpen
CSS External
body {background-color:silver}
h1 {color : red}
h2 {color : blue}
p {font-size:10pt; margin...
By I Wayan Simpen
Cara Memangil CSS
• Tempatkan perintah berikut pada antara
tag <HEAD> dan </EHAD>
<HEAD>
<Link rel="styl...
By I Wayan Simpen
Contoh Lain:
By I Wayan Simpen
FRAME
• Untuk membangun web page yang
memungkinkan menampilkan beberapa
web page dalam satu window brows...
By I Wayan Simpen
Bentuk umum Frame
<FRAMESET BORDER=# ([rows|cols}=(#, [#
[,..]])>
<FRAME SRC=“url” NAME=“namaFrame”>
</F...
By I Wayan Simpen
Target Frame
Nama Frame Kegunaan
_self
Target frame adalah frame tempat
link berada
_top
Target frame ad...
By I Wayan Simpen
Contoh:
• Buat 3 dokumen html dengan nama masing-
masing: Atas.htm, Kiri.htm, dan Kanan.htm
• Buat frame...
By I Wayan Simpen
Hasil
By I Wayan Simpen
Contoh Lengkap
Upcoming SlideShare
Loading in …5
×

Pertemuan 07

186 views
118 views

Published on

0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
186
On SlideShare
0
From Embeds
0
Number of Embeds
34
Actions
Shares
0
Downloads
2
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Pertemuan 07

  1. 1. PEMROGRAMAN WEB I Oleh: I Wayan Simpen
  2. 2. By I Wayan Simpen Agenda • Font & CSS • Frame
  3. 3. By I Wayan Simpen Font • Atribut Tag Font Atribut Kegunaan Size=“n” Menentukan ukuran font sebesar n (n=1..7) Size=“+n” Menaikkan ukuran font sebesar n Size=“-n” Menurunkan ukuran forn sebesar n Face=“Nama_Font” Menentukan jenis fornt Color=“Warna” Menentukan warna font
  4. 4. By I Wayan Simpen Contoh: • Penggunaan <Font Size=“”> <BODY> <FONT SIZE=1>FONT SIZE=1</FONT><br> <FONT SIZE=2>FONT SIZE=2</FONT><br> <FONT SIZE=3>FONT SIZE=3</FONT><br> <FONT SIZE=4>FONT SIZE=4</FONT><br> <FONT SIZE=5>FONT SIZE=5</FONT><br> <FONT SIZE=6>FONT SIZE=6</FONT><br> <FONT SIZE=7>FONT SIZE=7</FONT> </BODY>
  5. 5. By I Wayan Simpen Hasil
  6. 6. By I Wayan Simpen Menggunakan Font Color <HTML> <BODY BGCOLOR="SILVER"> <FONT SIZE=1>FONT SIZE=1</FONT><br> <FONT SIZE=2 Color="blue">FONT SIZE=2</FONT><br> <FONT SIZE=3 color="red">FONT SIZE=3</FONT><br> <FONT SIZE=4 color="#00EEff">FONT SIZE=4</FONT><br> <FONT SIZE=5 color="green">FONT SIZE=5</FONT><br> <FONT SIZE=6 color="yellow">FONT SIZE=6</FONT><br> <FONT SIZE=7 color="#ff8800">FONT SIZE=7</FONT> </BODY> </HTML>
  7. 7. By I Wayan Simpen Hasil
  8. 8. By I Wayan Simpen Menggunakan <Font face=“”> <BODY BGCOLOR="SILVER"> <FONT SIZE=6> <FONT face="Arial Black">Font Arial Balck</font><br> <FONT face="Tahoma">Font Tahoma</font><br> <FONT face="Comic Sans MS">Font Comic Sans MS</font><br> <FONT face="Time New Roman">Font Time New Roman</font><br> <FONT face="Arenski">Font Arenski</font> </BODY>
  9. 9. By I Wayan Simpen Hasil
  10. 10. By I Wayan Simpen Contoh Lain <body bgcolor="silver"> <p><FONT face="Tahoma" size="6" color="red"> Apakah dokumen HTML itu ?</font> <p align="justify"><FONT face="Comic Sans MS" color="green"> Adalah file teks reguler (file ASCII) yang diciptakan dengan menggunakan editor teks (misalnya, Notepad dalam Windows, Emacs atau vi dalam Unix/Linux) atau dengan menggunakan word processor, yaitu bila menyimpannya dalam format "text only with line breaks"</font>
  11. 11. By I Wayan Simpen <p><FONT face="Time New Roman" Color="Blue"> Adalah dokumen yang tampil dalam Web, dimana semua orang dalam seluruh jaringan Internet di seluruh dunia dapat mengaksesnya </body>
  12. 12. By I Wayan Simpen Hasil
  13. 13. By I Wayan Simpen CSS • CSS (Cascade Style Sheet) merupakan fitur baru dari HTML hal ini diperlukan agar manajemen pages menjadi lebih mudah dan efesien. • Aturan Penggunaan CSS Selector {property:Value}
  14. 14. By I Wayan Simpen Jenis CSS CSS CSS Internal CSS External CSS in Line
  15. 15. By I Wayan Simpen CSS Internal<HTML> <HEAD> <style> body {background-color:silver} h1 {color : red} h2 {color : blue} p {font-size:10pt; margin-left: 15px; text- align:Justify} A:Link {color:Blue} A:Visibled {color:red} A:Ative {Color:green} A:Hover {color:maroon; font-weight:bold} </style> </HEAD> <BODY>……..</BODY><HTML>
  16. 16. By I Wayan Simpen CSS External body {background-color:silver} h1 {color : red} h2 {color : blue} p {font-size:10pt; margin-left: 15px; text- Align:Justify} A:Link {color:Blue} A:Visibled {color:red} A:Ative {Color:green} A:Hover {color:maroon; font-weight:bold} Buat Dokumen dengan nama Format.CSS yang isinya sebagai berikut:
  17. 17. By I Wayan Simpen Cara Memangil CSS • Tempatkan perintah berikut pada antara tag <HEAD> dan </EHAD> <HEAD> <Link rel="stylesheet" type="text/css" href="format.css"> </HEAD>
  18. 18. By I Wayan Simpen Contoh Lain:
  19. 19. By I Wayan Simpen FRAME • Untuk membangun web page yang memungkinkan menampilkan beberapa web page dalam satu window browser. • Untuk memperjelas penyajian informasi dan biasanya disediakan menu pilihan.
  20. 20. By I Wayan Simpen Bentuk umum Frame <FRAMESET BORDER=# ([rows|cols}=(#, [# [,..]])> <FRAME SRC=“url” NAME=“namaFrame”> </FRAMESET>
  21. 21. By I Wayan Simpen Target Frame Nama Frame Kegunaan _self Target frame adalah frame tempat link berada _top Target frame adalah window tempat frame berada (frame yang lain akan hilang) _parent Target frame adalah setingkat di atas link berada _blank Membuka pada window baru
  22. 22. By I Wayan Simpen Contoh: • Buat 3 dokumen html dengan nama masing- masing: Atas.htm, Kiri.htm, dan Kanan.htm • Buat frame seperti berikut: <HTML> <HEAD><TITLE>Frame</TITLE></HEAD> <FRAMESET FRAMESPACING="1" ROWS="92,*"> <FRAME NAME="judul" SCROLLING="no" NORESIZE src="Atas.htm"> <FRAMESET COLS="180,*"> <FRAME NAME="menu" SRC="Kiri.htm" SCROLLING="no"> <FRAME NAME="main" SRC="Kanan.htm"> </FRAMESET> </FRAMESET> </HTML>
  23. 23. By I Wayan Simpen Hasil
  24. 24. By I Wayan Simpen Contoh Lengkap

×