PROFIL
Nama : Yusra Fernando, S.Kom., M.Kom.
Status : Menikah
Anak: (1) Muhammad Ibrahim Hanif Fernando
(2) Muhammad Zahid Hafizh Fernando
Pendidikan : S1, Teknik Informatika/(Ti) (Teknokrat 2004)
S2, Ilmu Komputer/(Cs) (IPB 2012)
Email : yusra.fernando@teknokrat.ac.id
Pengalaman
Pekerjaan :  Asisten Dosen STMIK TEKNOKRAT 2006-2008
 Dosen STMIK TEKNOKRAT 2009 - 2017
 Dosen UNIVERSITAS TEKNOKRAT INDONESIA 2017 – Sekarang
 Tim Kerja Bidang Kemahasiswaan (2015-2017)
 Wakil Dekan III FTIK (2017)
 Tim Kerja Wakil Rektor III Bidang Kemahasiswaan (2017-
2019)
 Wakil Dekan III FEB (2019)
No. Telepon : 0852 7920 9118 (sms, line, WA)
yusra.fernando@teknokrat.ac.id
+6252 7920 9118
+6252 7920 9118
Yusra Fernando, M.Kom
CONTACT ME
2
CSS (Cascading Style Sheets)
PENGENALAN CSS
 CSS adalah kumpulan format yang digunakan
untuk mengatur tampilan atau isi dari sebuah
halaman web menjadi lebih fleksibel.
 Elemen dasar CSS :
1. Selector adalah tag/elemen normal pada
HTML
2. Deklarasi adalah satu atau beberapa
perintah/nilai dari CSS yang menunjukkan
type/bentuk yang diaplikasikan pada selector,
yang terdiri dari :
 Properti (property)
 Nilai Properti (value)
selector { property: value }
PENULISAN CSS
 Inline Style
 Internal Style
 Eksternal Style
INLINE STYLE
 Merupakan CSS style yang disisipkan pada
elemen web tertentu saja dalam satu
dokumen.
 Contoh :
......
<p style="font-family: verdana; color: blue">
Paragraph ini berwarna biru
</p>
......
INTERNAL STYLE
 Merupakan CSS style yang disisipkan diantara tag
<head> .. </head>).
 Contoh :
<html>
<head>
<title>Internal CSS Style</title>
<style type="text/css">
table { font-family: verdana; font-size:10px }
</style>
</head>
<body>
......
</body>
</html>
EKSTERNAL STYLE
 CSS Style yang disimpan terpisah dengan
dokumen HTML.
 Contoh :
eksternal.css (nama file CSS) :
/* CSS Document */
hr { color: sienna }
p { font-family: verdana; color: blue }
table { font-family: verdana; font-size: 10pt }
EKSTERNAL STYLE
eksternal.htm (File HTML yang memanggil file CSS) :
<html>
<head>
<title>Eksternal CSS</title>
<link rel="stylesheet" type="text/css"
href="eksternal.css">
</head>
<body>
......
</body>
</html>
PENGGUNAAN KELAS
 Kelas digunakan untuk mendefiniskan suatu
style.
 Bentuk Pendefinisian kelas :
.nama_kelas { property: value }
 Cara memberi nama kelas :
 Dapat mengandung huruf, angka, atau
karakter garis bawah.
 Karakter pertama harus huruf atau karakter
garis bawah.
 Tidak boleh mengandung spasi.
PENGGUNAAN KELAS
 Contoh :
<html>
<head>
<title>Penggunaan Kelas</title>
<style type="text/css">
.kapital { text-transform: uppercase }
.garis_bawah { text-decoration: underline }
</style>
</head>
<body>
<p class="kapital">Huruf Kapital</p>
<span class="garis_bawah">Garis Bawah</span>
</body>
</html>

Css pengenalan css

  • 2.
    PROFIL Nama : YusraFernando, S.Kom., M.Kom. Status : Menikah Anak: (1) Muhammad Ibrahim Hanif Fernando (2) Muhammad Zahid Hafizh Fernando Pendidikan : S1, Teknik Informatika/(Ti) (Teknokrat 2004) S2, Ilmu Komputer/(Cs) (IPB 2012) Email : yusra.fernando@teknokrat.ac.id Pengalaman Pekerjaan :  Asisten Dosen STMIK TEKNOKRAT 2006-2008  Dosen STMIK TEKNOKRAT 2009 - 2017  Dosen UNIVERSITAS TEKNOKRAT INDONESIA 2017 – Sekarang  Tim Kerja Bidang Kemahasiswaan (2015-2017)  Wakil Dekan III FTIK (2017)  Tim Kerja Wakil Rektor III Bidang Kemahasiswaan (2017- 2019)  Wakil Dekan III FEB (2019) No. Telepon : 0852 7920 9118 (sms, line, WA) yusra.fernando@teknokrat.ac.id +6252 7920 9118 +6252 7920 9118 Yusra Fernando, M.Kom CONTACT ME 2
  • 3.
  • 4.
    PENGENALAN CSS  CSSadalah kumpulan format yang digunakan untuk mengatur tampilan atau isi dari sebuah halaman web menjadi lebih fleksibel.  Elemen dasar CSS : 1. Selector adalah tag/elemen normal pada HTML 2. Deklarasi adalah satu atau beberapa perintah/nilai dari CSS yang menunjukkan type/bentuk yang diaplikasikan pada selector, yang terdiri dari :  Properti (property)  Nilai Properti (value) selector { property: value }
  • 5.
    PENULISAN CSS  InlineStyle  Internal Style  Eksternal Style
  • 6.
    INLINE STYLE  MerupakanCSS style yang disisipkan pada elemen web tertentu saja dalam satu dokumen.  Contoh : ...... <p style="font-family: verdana; color: blue"> Paragraph ini berwarna biru </p> ......
  • 7.
    INTERNAL STYLE  MerupakanCSS style yang disisipkan diantara tag <head> .. </head>).  Contoh : <html> <head> <title>Internal CSS Style</title> <style type="text/css"> table { font-family: verdana; font-size:10px } </style> </head> <body> ...... </body> </html>
  • 8.
    EKSTERNAL STYLE  CSSStyle yang disimpan terpisah dengan dokumen HTML.  Contoh : eksternal.css (nama file CSS) : /* CSS Document */ hr { color: sienna } p { font-family: verdana; color: blue } table { font-family: verdana; font-size: 10pt }
  • 9.
    EKSTERNAL STYLE eksternal.htm (FileHTML yang memanggil file CSS) : <html> <head> <title>Eksternal CSS</title> <link rel="stylesheet" type="text/css" href="eksternal.css"> </head> <body> ...... </body> </html>
  • 10.
    PENGGUNAAN KELAS  Kelasdigunakan untuk mendefiniskan suatu style.  Bentuk Pendefinisian kelas : .nama_kelas { property: value }  Cara memberi nama kelas :  Dapat mengandung huruf, angka, atau karakter garis bawah.  Karakter pertama harus huruf atau karakter garis bawah.  Tidak boleh mengandung spasi.
  • 11.
    PENGGUNAAN KELAS  Contoh: <html> <head> <title>Penggunaan Kelas</title> <style type="text/css"> .kapital { text-transform: uppercase } .garis_bawah { text-decoration: underline } </style> </head> <body> <p class="kapital">Huruf Kapital</p> <span class="garis_bawah">Garis Bawah</span> </body> </html>