Class and ID Selector.

Slides:



Advertisements
Presentasi serupa
Cascading Style Sheet Gufron Gufron - Sub Bahasan • Pendahuluan • Konsep Dasar CSS • Syntax/Perintah CSS • Implementasi.
Advertisements

Pertemuan 2.  Dreamweaver adl salah satu program pembuatan website yang mempunyai banyak sekali menu-menu dan tool-tool yang dapat dipergunakan untuk.
Cascade Style Sheet (CSS) Dahlan Abdullah /
13 CSS ( CASCADING STYLE SHEET II ) Bayangkan jika kita memiliki website dengan 100 halaman. Bayangkan apabila anda ingin mengganti jenis huruf dari tiap.
Reza Sulistyawan, S.Kom Pemrograman Web 1 1 text yang ditampilkan Sebagai contoh lihat script berikut : Belajar HTML Nyookk..! Hasilnya Membuat text berjalan.
( Cascading Style Sheet) Bagian 1
Pertemuan 9 Cascading Style Sheet (css)
Minggu …8… Page 1 MINGGU Ke delapan Web Teknologi 2 Pokok Bahasan: CSS and Themes Tujuan Instruksional Khusus: Mahasiswa akan dapat menjelaskan dan mengaplikasikan.
Dasar CSS A’ud Solehuddin::Februari2012. Materi Mengenal CSS Mengenal CSS Mencoba CSS Mencoba CSS Penggunaan atribut ID dalam tag Penggunaan atribut ID.
Tim FT Elektro UHAMKA CSS (Cascading Style Sheet)
CSS (Cascading Style Sheet)
Modul -4 : CSS 1 Mempelajari dasar-dasar CSS : Inheritance, class, positioning dan watermarking Cascading Style Sheet (CSS) Modul-4 :
CSS.
HTML - CSS Cascading Style Sheet.
Pengembangan Evangs Mailoa Cascading Style Sheet (CSS) dan HTML Form WEB.
Cascading Style Sheet Oleh : Edy Mulyanto
Pemrograman Berbasis Web CSS
Atribut dalam Body Atribut dan contoh penulisan Fungsi
CSS (Cascading Style Sheet)
PENGENALAN CSS CSS = Cascading Style Sheet Fungsi : mendefenisikan style untuk suatu teks dengan jenis huruf, ukuran, warna tertentu.
Cascading Style Sheet (CSS) dan HTML Form
Cascading Style Sheet (CSS)
Modul 9 STMIK IKMI CIREBON Oleh Dita rizki amalia.
Cascading Style Sheet (CSS)
Lutfi Budi Ilmawan Univ. Muslim Indonesia
Pemrograman Berbasis Web CSS
Pemrograman internet ABU SALAM, M.KOM.
Cascading Style Sheet (CSS)
PERTEMUAN CSS Pengenalan CSS.
(Cascading Style Sheet)
Pemrograman Basis Data Berbasis Web
CSS (Cascading Style Sheet)
Konsep Dasar HTML SLIDE 1 Agung Brastama Putra.
Cascading Style Sheets (CSS)
Pengenalan CSS Apasih CSS itu ?.
Pengolahan Informasi Berbasis Bahasa Pemrograman Script
Perancangan & Pemrograman Web
Firman Wahyudhie Cascading STYLE SHEET.
S1 Teknik Informatika - Unijoyo
PRIN STIANINGSIH TEACHER OF SMK NEGERI 1 PEKANBARU
KOMPUTER APLIKASI IT XHTML & CSS MODUL 02
Layout/Struktur Web dengan Div, dan Span
(Cascading Stylesheet)
CSS Pertemuan 12 Matakuliah : L0182 / Web & Animation Design
Cascading Style Sheet (CSS)
Memahami Tag div (Division)
Area Kerja Dreamweaver
Cascade Style Sheet (CSS)
( Cascading Style Sheet) Bagian 1
CSS.
Pemrograman Basis Data Berbasis Web
( Cascading style sheets)
Pemrograman Web HTML (5) Form CSS Andy Haryoko, ST
Assalamu’alaikum Warohmatullah Wabarokatuh Selamat Pagi 
Pemrograman Berorientasi Platform (IN315B)
Cascading Style Sheet (CSS)
APLIKASI KOMPUTER “WEBSITE”
Urutan Prioritas Selector CSS (Cascading)
Implementasi CSS Ada 4 cara memasang kode CSS ke dalam halaman situs, yaitu: Inline CSS Embedded (memasang kode ke dalam bagian External.
Cascading Style Sheet (CSS) dan HTML Form
Cascading Style Sheet.
Cascading Style Sheet (CSS) dan HTML Form
PENGENALAN CSS CSS = Cascading Style Sheet Fungsi : mendefenisikan style untuk suatu teks dengan jenis huruf, ukuran, warna tertentu.
CSS (Cascading Style Sheet)
CSS (Cascading Style Sheet)
Hyperlink dengan CSS Contoh code program HTML hyperlink dengan CSS, untuk code HTMLnya seperti berikut :
List dan Image pada HTML
Cascading Style Sheet (CSS) dan HTML Form
CSS Cascading Style Sheet
Web Design CSS.
Transcript presentasi:

Class and ID Selector

Class Selector .tengah {text-align:center;} p.tengah {color:#ff0000;} Contoh penulisan syntax CSS: .tengah {text-align:center;} p.tengah {color:#ff0000;} h1.kiri {color:#0000ff;} h1.tengah {color:#000000;} Contoh pemakaian kode CSS: <div class=tengah> <p>Teks tengah akan berwarna merah.</p> <h1 class=tengah>Tag H1 tengah akan berwarna hitam</h1> </div> <h1 class=kiri>Tag H1 kiri akan berwarna biru</h1>

Class Selector (Lanjutan) Hasil Teks tengah akan berwarna merah. Tag H1 tengah akan berwarna hitam Tag H1 kiri akan berwarna biru

ID Selector ID Selector mirip dengan Class selector. Untuk membedakannya, gunakanlah ID selector untuk memformat bagian yang hanya muncul satu kali dalam satu halaman web, misalnya untuk memformat bagian menu / sidebar. Cara penulisan ID Selector: #nama-ID {property:value;} Untuk menempelkan ID selector ke dalam tag HTML: taghtml#nama-ID {Property:value;} Perhatikan tanda # di setiap awal nama ID. Jika ingin menggunakan class ID selector di luar kode HTML, gunakan tag <div id=nama-ID> dan di akhiri dengan tag </div>.

ID Selector #tengah {text-align:center;} p.tengah {color:#ff0000;} Contoh penulisan syntax CSS: #tengah {text-align:center;} p.tengah {color:#ff0000;} h1.kiri {color:#0000ff;} h1.tengah {color:#000000;} Contoh pemakaian kode CSS: <span id=tengah> <p>Teks tengah akan berwarna merah.</p> <h1 class=tengah>Tag H1 tengah akan berwarna hitam</h1> </span> <h1 class=kiri>Tag H1 kiri akan berwarna biru</h1>

Latihan……………………………………?