• About
  • Sitemap
  • Privacy Policy
  • Disclaimer
  • Contact

S3Ek3elE3BHAdHZ indfO

  • Home
  • Musik
    • Dangdut Koplo
    • Indonesia
    • Manca
    • House
    • Jawa
    • Religi
  • Hiburan
    • Game
    • Film
  • Video
  • Iptek
  • Otomotif
  • Info Umum
  • TipsnTrick
  • Software
Home » Uncategories » CSS adalah

CSS adalah

Cascading Stylesheet (CSS) adalah mekanisme sederhana untuk mengubah Jenis Huruf, Warna, Ukuran dan lain-lain pada halaman website. Dengan menggunakan CSS, pengaturan tampilan halaman web dapat diorganisasikan dalam satu file sehingga memudahkan untuk mengubah atau memperbaiki tampilan halaman website tersebut tanpa harus mengubah satu per satu setiap halaman yang berkaitan dalam sebuah website.

Pengenalan XHTML

XHTML adalah cara penulisan perintah-perintah untuk menghasilkan tampilan halaman website. Halaman XHTML memiliki struktur seperti contoh berikut:






Isi dari halaman website dituliskan pada bagian antara  dan . Sedangkan bagian  sampai dengan  digunakan untuk menyisipkan perintah (tag) lainnya seperti memanggil file javascript, mendeklarasikan kata kunci (keywords) dan menuliskan keterangan tentang halaman website (description). Perintah untuk memanggil file CSS juga ditempatkan pada bagian ini.
Sedangkan kode-kode yang biasa digunakan untuk menuliskan isi dari halaman website adalah seperti contoh berikut:
  • ...
    Untuk menempatkan teks yang berupa paragraf.
  • ...

    , 

    ...

    , 

    ...


    Untuk menuliskan judul dari kelompok paragraf.
  • ...

    Disebut sebagai layer yang berfungsi untuk mengelompokkan beberapa paragraf.
Berikut adalah contoh penulisan halaman XHTML:





 

Contoh Halaman Website

Ini adalah isi paragraf dari contoh halaman website
Kode-kode XHTML lainnya yang bisa Anda pelajari dari file yang dapat diunduh dari sini.

Penggunaan CSS

CSS dapat dibuat hanya dengan menggunakan Notepad atau text editorsederhana lainnya dan disimpan dengan ekstensi .css. Agar halaman website dapat membaca file CSS tersebut maka perlu ditambahkan baris kode tertentu pada bagian  halaman website tersebut seperti contoh di bawah ini:








 

Contoh Halaman Website

Ini adalah isi paragraf dari contoh halaman website
[URL] = Alamat URL tempat file CSS tersebut disimpan

Penulisan kode CSS

Kode CSS disebut dengan style. Penulisan kode CSS dalam sebuah file CSS adalah dengan format sebagai berikut
tag { property: value; }
tag = tag XHTML, atau nama layer dimana style tersebut berfungsi.
property = Detail yang tampilannya diubah dengan style tersebut.
value = Nilai dari properti di atas.

Sebagai contoh, untuk mengubah format tampilah dari sebuah judul artikel (header) yang memiliki kode 

Contoh Halaman Website

 menjadi bergaris bawah, berwarna biru dan berukuran 28 pixel, maka dalam file CSS dapat ditulis:
h1 { text-decoration: underline,  color: blue; font-size: 28px; }
Hal tersebut akan menimbulkan efek yang sama untuk setiap kali kode 

...

 digunakan dalam halaman XHTML.
Cara penulisan lainnya adalah dengan mendefinisikan style berdasarkan class atau ID layer. Untuk cara ini, maka kode XHTML harus mendefinisikan nama class atau identitas layer yang digunakan seperti pada contoh berikut:
  • Header dengan class bernama “judul”
    Pada halaman XHTML ditulis:

    Contoh Halaman Website


    Pada file CSS didefinisikan:
    .judul { text-decoration: underline, color: blue; font-size: 28px; }
  • Kode ini tidak merubah semua tag 

    ...

    , namun akan merubah semua tag yang memiliki nama class yang sama seperti misalnya: 
    ...
  • Header dengan ID bernama “judul”
    Pada halaman XHTML ditulis:

    Contoh Halaman Website


    Pada file CSS didefinisikan:
    #judul { text-decoration: underline, color: blue; font-size: 28px; }
    Kode ini juga memiliki pengaruh yang sama dengan penggunaan berdasarkan class.

Hal utama yang perlu diperhatikan adalah bahwa penulisan style dalam CSS harus berurutan dan diperhatikan agar jangan sampai tumpang tindih. Untuk lebih jelasnya, perhatikan contoh berikut:
Pada CSS tertulis:
h1 { text-decoration: underline, color: blue; font-size: 28px; }
#pagetitle { font-size: 12px; }
Pada halaman website tertulis:

Contoh Halaman Website

Maka yang terjadi adalah, pada tampilan website besar tulisan “Contoh Halaman Website” adalah hanya 12 pixel, bukan 28 pixel karena ID untuk tag h1 yaitu #pagetitle dituliskan paling akhir.

Class dan ID dalam CSS

Untuk memudahkan, berikut adalah penjelasan secara umum tentang penggunaan class dan ID dalam CSS dan XHTML.
  1. ID juga dapat digunakan untuk menamai tag sebagai identifikasi pada javascript.
  2. ID bersifat unik pada setiap halaman, tidak boleh lebih dari satu tag memiliki id yang sama pada satu halaman yang sama.
  3. Class dapat digunakan berulang kali, satu tag dapat memiliki class lebih dari satu seperti misal:

    Contoh Halaman Website


    dimana judul, besar dan kanan memiliki style yang saling melengkapi.
  4. ID biasanya bersifat global yang dibedakan menjadi blok-blok tertentu misalkan, header, content, sidebar dan footer. Class biasanya digunakan untuk membedakan style tertentu yang dibedakan antara misalnya warna, jenis huruf atau besar huruf.
  5. Class dapat digunakan untuk mempertegas style dari ID yang bersifat global dengan menggunakannya bersama-sama pada satu tag seperti misal:

    Contoh Halaman Website


Posted by Unknown on - Rating: 4.5
Title : CSS adalah
Description : Cascading Stylesheet (CSS) adalah mekanisme sederhana untuk mengubah Jenis Huruf, Warna, Ukuran dan lain-lain pada halaman website. Dengan m...
Tweet

0 Response to "CSS adalah"

Post a Comment

Newer Post
Older Post
Home
Subscribe to: Post Comments (Atom)

Entri Populer

  • 5 Pertimbangan Sebelum Membeli Kamera SLR
    Memilih kamera SLR digital yang tepat adalah urusan pelik tersendiri dengan banjirnya merk dan tipe kamera di pasar. Saat ini (Nov 2009) p...
  • Kumpulan DNS Terlengkap
    Sobat pasti sudah tahu kan fungsi dari DNS, yaitu untuk mempercepat koneksi internet kita sekaligus menyaring situs-situs yang berbahaya. ...
  • Javascript adalah
    Javascript . satu istilah yang sering sekali kita dengar. Anda yang mengelola blog pasti akan sering mendengar istilah ini ketika memasa...
  • Membuat Gambar Di Chatingan Facebook
    Kali ini saya akan share bagaimana membuat gambar besar pada chatingan Facebook. Caranya hanya dengan mengcopy kode-kode berikut ke chating...
  • Cara Mengganti Nama Facebook Yang Sudah Melewati Batas Limit (Over)
    1. ganti nama fb sobat di pengaturan akun (ganti nama terserah sobat dulu di kolom nama yg udh tersedia...yang penting namanya berubah) m...

Arsip

  • ►  2014 (1)
    • ►  09/03 - 16/03 (1)
  • ►  2013 (1)
    • ►  24/02 - 03/03 (1)
  • ►  2012 (134)
    • ►  28/10 - 04/11 (2)
    • ►  21/10 - 28/10 (3)
    • ►  14/10 - 21/10 (3)
    • ►  07/10 - 14/10 (2)
    • ►  30/09 - 07/10 (2)
    • ►  23/09 - 30/09 (2)
    • ►  02/09 - 09/09 (4)
    • ►  12/08 - 19/08 (7)
    • ►  05/08 - 12/08 (1)
    • ►  24/06 - 01/07 (1)
    • ►  17/06 - 24/06 (3)
    • ►  03/06 - 10/06 (29)
    • ►  27/05 - 03/06 (3)
    • ►  13/05 - 20/05 (7)
    • ►  06/05 - 13/05 (3)
    • ►  29/04 - 06/05 (2)
    • ►  15/04 - 22/04 (4)
    • ►  08/04 - 15/04 (27)
    • ►  18/03 - 25/03 (1)
    • ►  29/01 - 05/02 (21)
    • ►  22/01 - 29/01 (1)
    • ►  08/01 - 15/01 (1)
    • ►  01/01 - 08/01 (5)
  • ▼  2011 (138)
    • ►  18/12 - 25/12 (2)
    • ►  20/11 - 27/11 (29)
    • ►  06/11 - 13/11 (1)
    • ►  04/09 - 11/09 (10)
    • ▼  28/08 - 04/09 (26)
      • 10 Situs Template Blogger Terbaik
      • Mengapa Ngeblog??Mari Blogging!!!
      • blog adalah
      • HTML adalah
      • Javascript adalah
      • SEO adalah
      • ImageShack® - Online Photo and Video Hosting
      • CSS adalah
      • Jangan Pernah Mengeluh dengan Blog Kamu
      • Membuat Kotak Komentar di bawah Postingan
      • Cara Membuat Read More / Baca Selengkapnya di Blogger
      • Faktor-Faktor Penyebab Windows XP Menjadi Lambat
      • 20 Password Paling Umum dan Berbahaya
      • Cara Membackup Blog
      • Kamus Istilah-Istilah Dalam Blog
      • Semuanya tentang Windows 7 - Tips dan Trik lengkap...
      • Tips Merawat LCD Leptop
      • Tips Merawat Keyboard PC dan Leptop
      • Tips cara melacak Private Number HP
      • Cara mengetahui jumlah pulsa teman kamu tanpa pinj...
      • Cara memblokir nomor hp teman
      • Cara Telephon Gratis
      • Cara Membuat Aplikasi Handphone
      • Tips untuk merawat beterai leptop agar tahan lama
      • Kumpulan SMS Ucapan Selamat Hari Raya Idul Fitri/L...
      • Mp3 Takbiran 2011.mp3
    • ►  14/08 - 21/08 (7)
    • ►  07/08 - 14/08 (9)
    • ►  31/07 - 07/08 (20)
    • ►  24/07 - 31/07 (16)
    • ►  10/07 - 17/07 (2)
    • ►  26/06 - 03/07 (1)
    • ►  19/06 - 26/06 (1)
    • ►  22/05 - 29/05 (9)
    • ►  27/03 - 03/04 (5)
▲
Copyright © 2010 - 2014 S3Ek3elE3BHAdHZ indfO - All Rights Reserved
Design by Mas Sugeng - Powered by Blogger