5/12/2018
Makalah SSC -slidepdf.com
MAKALAH PEMRORAMAN WEB
TENTANG
CSS
NAMA
: EDDY SATRIAWAN
NIM
: 0910520027
SEKOLAH TINGGI MANAJEMEN INFORMATIKA DAN KOMPUTER
BUMIGORA MATARAM
2011
http://slidepdf.com/reader/full/makalah-css
1/14
5/12/2018
Makalah SSC -slidepdf.com
Bab. I
Pendahuluan
Latar Belakang
CSS digunakan oleh penulis maupun pembaca halaman web untuk menentukan warna,
jenis huruf, tata letak, dan berbagai aspek tampilan dokumen. CSS digunakan terutama
untuk memisahkan antara isi dokumen (yang ditulis dengan HTML atau bahasa markup
lainnya) dengan presentasi dokumen (yang ditulis dengan CSS) . Pemisahan ini dapat
meningkatkan aksesibilitas isi, memberikan lebih banyak keleluasaan dan kontrol terhadap
tampilan, dan mengurangi kompleksitas serta pengulangan pada stuktur isi
http://slidepdf.com/reader/full/makalah-css
2/14
5/12/2018
Makalah SSC -slidepdf.com
Bab.II
Dasar Teori
Cascading Style Sheets (CSS) adalah suatu bahasa stylesheet yang digunakan untuk
mengatur tampilan suatu dokumen yang ditulis dalam bahasa markup. Penggunaan yang
paling umum dari CSS adalah untuk memformat halaman web yang ditulis dengan HTML dan
XHTML. Walaupun demikian, bahasanya sendiri dapat dipergunakan untuk semua jenis
dokumen XML termasuk SVG dan XUL. Spesifikasi CSS diatur oleh World Wide Web
Consortium (W3C).
CSS digunakan oleh penulis maupun pembaca halaman web untuk menentukan warna,
jenis huruf, tata letak, dan berbagai aspek tampilan dokumen. CSS digunakan terutama
untuk memisahkan antara isi dokumen (yang ditulis dengan HTML atau bahasa markup
lainnya) dengan presentasi dokumen (yang ditulis dengan CSS) . Pemisahan ini dapat
meningkatkan aksesibilitas isi, memberikan lebih banyak keleluasaan dan kontrol terhadap
tampilan, dan mengurangi kompleksitas serta pengulangan pada stuktur isi.
CSS memungkinkan halaman yang sama untuk ditampilkan dengan cara yang berbeda untuk
metode presentasi yang berbeda, seperti melalui layar, cetak, suara (sewaktu dibacakan oleh
browser basis-suara atau pembaca layar), dan juga alat pembaca braille. Halaman HTML atau
XML yang sama juga dapat ditampilkan secara berbeda, baik dari segi gaya tampilan atau
skema warna dengan menggunakan CSS.
http://slidepdf.com/reader/full/makalah-css
3/14
5/12/2018
Makalah SSC -slidepdf.com
Bab.III
Tugas pendahuluan
1. Pengaturan Latar belakang
<html>
<head>
<style type="text/css">
body
{
Background: #00ff00
url("gambar.gif")
no-repeat fixed
center center
}
</style>
</head>
<body>
<p>
<b>Catatan:</b>
seperti background-attachment dan background-position tidak bisa digunakan dalam
browser Netscape 4.0
</p>
<p>Ada teks disini</p>
<p>Tuliskan sekehendak kalian</p>
<p>Terserah apa saja</p>
<p>Yang penting ada tulisannya</p>
</body>
</html>
http://slidepdf.com/reader/full/makalah-css
4/14
5/12/2018
Makalah SSC -slidepdf.com
2.
Penanganan Font
<html> <head>
<style type="text/css"> p.normal
{font-weight: normal} p.tebal {fontweight: bold} p.teballl {font-weight:
900} p.lengkap
{
font: italic small-caps 900 12px arial
}
</style>
</head>
<body>
<p class="normal"> Perhatikan
paragraf ini</p>
<p class="tebal">
Bandingkan dengan paragraf diatasnya </p> <p
class="teballl">
Bandingkan dengan yang ini juga</p> <p
class="lengkap">
Paragraf dengan semua atribut font dimasukan </p>
</body>
</html>
3. Pembuatan Border
<html>
http://slidepdf.com/reader/full/makalah-css
5/14
5/12/2018
Makalah SSC -slidepdf.com
<head>
<style type="text/css">
p.borderous
{
border-style: double;
border-width: 5px 10px 1px medium;
border-color: #ff0000
#00ff00 #0000ff
rgb(250,0,255)
}
</style>
</head>
<body>
<p class="borderous">
<b>Catatan:</b> properti "border-color" dan "border-width" tidak dikenali oleh browser Internet
Explorer bila digunakan secara langsung. Gunakan properti "border-style" untuk menyiapkan border
dalam Internet Explorer.<br />
Internet Explorer 5.5 mendukung semua border style. Internet Explorer 4.0-5.0 tidak mendukung
nilai "dotted" dan "dashed" </p>
</body>
</html>
4. Pengaturan Margin
<html>
<head>
<style type="text/css">
p.margin {margin: 2cm 4cm 3cm 80px;}
</style>
http://slidepdf.com/reader/full/makalah-css
6/14
5/12/2018
Makalah SSC -slidepdf.com
</head>
<body>
<p>
Yang ini adalah paragraf biasa tanpa pengaturan margin, sepertinya biasa saja.
</p>
<p class="margin">
Bandingkan dengan tampilan paragraf ini, Coba Anda kecilkan uuran window broser agar
terlihat lebih jelas perbedaanya.
</p>
<p>
This is a paragraph
</p>
</body>
</html>
5. Mengatur padding pada sel tabel
<html>
<head>
<style type="text/css">
td {padding: 1.5cm;}
td.value2 {padding: 0.5cm 2.5cm;}
</style>
</head>
<body>
<table border="1">
<tr>
<td>
Bandingkan dengan tampilan tabel ini. Padding atas dan bawah memiliki 0.5cm,
http://slidepdf.com/reader/full/makalah-css
7/14
5/12/2018
Makalah SSC -slidepdf.com
sedangkan padding kanan dan kiri nilainya 2.5cm.
</td>
</tr>
</table>
</body>
</html>
6. Menggunakan List
<html>
<head>
<style type="text/css">
ul
{ list-style: square outside url("gambarkecil.gif");} </style>
</head>
<body>
BAB IV
Implementasi
7. Pengaturan Latar belakang
http://slidepdf.com/reader/full/makalah-css
8/14
5/12/2018
Makalah SSC -slidepdf.com
8. Penanganan Font
9. Pembuatan Border
http://slidepdf.com/reader/full/makalah-css
9/14
5/12/2018
Makalah SSC -slidepdf.com
10.Pengaturan Margin
11.Mengatur padding pada sel tabel
http://slidepdf.com/reader/full/makalah-css
10/14
5/12/2018
Makalah SSC -slidepdf.com
12.Menggunakan List
13.Elemen latar depan dan latar belakang
http://slidepdf.com/reader/full/makalah-css
11/14
5/12/2018
Makalah SSC -slidepdf.com
14.Mengubah tampilan Link
http://slidepdf.com/reader/full/makalah-css
12/14
5/12/2018
Makalah SSC -slidepdf.com
BAB V
Penutup :
Kesimpulan
CSS adalah sebuah bahasa pemrograman untuk membuat sebuah halaman web. Anda perlu
menuliskan kode melalui editor teks seperti NotePad dilingkungan Windows. Kita dapat mendesain
program tersebut sesuai dengan keinginan kita. Dimana kita dapat memberikan warna
Font, menampilkan gambar, membuat garis horizontal, dan lainnya.
http://slidepdf.com/reader/full/makalah-css
13/14
5/12/2018
http://slidepdf.com/reader/full/makalah-css
Makalah SSC -slidepdf.com
14/14
