Rabu, 19 Agustus 2009

. Rabu, 19 Agustus 2009


Dasar css

CSS atau Cascading Style Sheet adalah bahasa pemrograman atau scripting untuk mengatur tampilan suatu website atau blog. Mungkin bagi para blogger sudah sering melihat kode CSS ini. Karena blog khususnya yang hosting di blogspot memang menggunakan CSS untuk merubah dan mangatur tampilan blog itu sendiri. Tampilan disini maksudnya untuk mengatur tampilan baik dari segi warna (huruf atau background), image, huruf dan elemen2 lain yang ada kaitannya dengan tampilan suatu blog atau web. Sebelum ada CSS, untuk mengatur tampilan suatu huruf biasanya menggunakan tag

bla bla bla

. Tapi setelah adanya CSS hal tersebut tidak perlu dilakukan lagi.

CSS bisa diaplikasikan dengan 3 cara :

  1. Langsung dituliskan pada tag . Dengan catatan harus diawali dengan tag .

  2. Menggunakan file eksternal. Maksudnya, setiap kode css disimpan pada suatu file dengan type .css dan nantinya di deklarasikan didalam tag dengan cara seperti berikut :



  3. Diaplikasikan langsung pada tag yang bersangkutan


Dalam penulisan kode CSS mempunyai aturan tersendiri. Mungkin bagi anda yang masih sangat awam mengenai CSS, artikel ini bisa dijadikan sebagai bahan pembelajaran bagi anda. Ya walaupun memang sangat dasar sekali, tapi ga ada salahnya kan...

Cara pendeklarasian dan penulisan CSS

  1. Menggunakan tanda # sebagai awalan. Contohnya :

    #my_style {
    background-color :#000;
    font-color :#fff;
    }


    Untuk pendeklarasiannya, karena memakai tanda # maka atribut yang digunakan adalah id. Sehingga contoh pendeklarasiannya adalah

    bla bla bla


    Nah..sehingga hasilnya akan menjadi seperti ini :

    bla bla bla


    Tapi ingat, sifat dari id adalah unik. Makanya tidak boleh ada elemen lain yang memakai id yang sama pada suatu CSS.

  2. Menggunakan tanda dot atau titik (.). sebagai awalan, contoh :

    .my_style {
    background-color :red;
    font-color :#fff;
    }


    Untuk pendeklarasiannya, karena memakai tanda (.) maka atribut yang digunakan adalah class. Sehingga contoh pendeklarasiannya adalah

    text


    Nah..sehingga hasilnya akan menjadi seperti ini :

    bla bla bla


    Nah..kalo sifat dari id adalah unik, maka sebaliknya kalo class tidak unik dan bisa diaplikasikan lebih dari 1 class yang sama dalam suatu doc html.

  3. Tanpa memakai tanda # atau (.) tapi langsung diaplikasikan pada suatu kode html, contoh :

    div {
    background-color:blue;
    }


    Nah jika memakai cara seperti ini, maka semua tag div akan mempunyai style yang sama sesuai kode CSSnya.


Ok....sekian dulu untuk pengenalan kode CSS. Jika masih merasa bingung, saya mohon maaf karena mungkin penjelasannya agak sedikit kacau alias berantakan.

Klik disini untuk melanjutkan »»

Senin, 10 Agustus 2009

. Senin, 10 Agustus 2009

Contoh warna @html

Aqua (#00FFFF)

Aqua marine (#7FFFD4)

Black(#00000)

Blue (#0000ff)

Cadet blue(#5F9EA0)

Darkcyan(#008686)
Darkgoldenrod(#688606)

Darkgray(#A9A9A9)
Darkgreen(#006400)
Darkkhaki(#606766)
Darkmagenta(#860086)
Darkolivegreen(#55662F)
Darkorange(#FF8C00)
Darkorchid(#9932CC)
Darkred(#860000)
Darksalmon(#E9967A)
Darkslateblue(#483086)
Darkslategray(#2F4F4F)
Darkturquoise(#00CED1)
Darkviolet(#940003)
Deeppink(#FF1493)
Deepskyblue(#00BFFF)
Dimgray(#696969)
Dodgerblue(#1E90FF)
Firebrick(#622222)

Floralwhite(#FFFAF0)
Forestgreen(#228622)
Gainsboro(#DCDCDC)
Gold(#FFD700)
Goldenrod(#DAA520)
Green(#008000)
Greenyellow(#ADFF2F)
Hotpink(#FF69B4)
Indianred(#CD5C5C)
Indigo(#460082)
Khaki(#F0E68C)
Lavender(#E6E6FA)
Lavenderblush(#FFF0F5)
Lawngreen(#7CFC00)
Lightblue(#ADD8E6)
Lightcoral(#F08080)
Lightcyan(#E0FFFF)
Lightgreen(#90EE90)
Lightgrey(#D3D3D3)
Lightpink(#FFB6C1)
Lightsalmon(#FFA07A)
Lightseagreen(#20B2AA)
Lightskyblue(#87CEFA)
Lightslategray(#778899)
Lightsteelblue(#B0C4DE)
Lime(#00ff00)
Limegreen(#32CD32)
Linen(#FAF0E6)
Magenta(#FF00FF)
Mediumorchid(#BA55D3)
Mediumpurple(#9370DB)
Mediumseagreen(#3CB371)
Mediumslateblue(#7B68EE)
Maroon(#800000)
Mediumturquoise(#4801CC)
Mediumvioletred(#071585)
Midnightblue(#191970)

Mintcream(#F5FFFA)
Mistyrose(#FFE4E1)
Moccasin(#FFE4B5)
Navajowhite(#FFDEAD)

Navy(#000080)

Old lace(#FDF5E6)
Olive(#808000)
Olivedrab(#6B8E23)
Orange(#FFA500)
Orangered(#FF4500)
Orchid(#DA70D6)
Palegoldenrod(#EEE8AA)
Palegreen(#98F698)
Paleturquoise(#AFEEEE)
Palevioletred(#DB7093)
Peachpuff(#FFDAB9)
Peru(#CD853F)
Pink(#FFCOC8)
Plum(#DDA0DD)
Purple(#800080)
Powderblue(#B0E0E6)
Red(#ff0000)
Rosybrown(#BC8F8F)
Royalblue(#4169E1)
Saddlebrown(#864513)
Salmon(#FA8072)
Sandybrown(#F4A460)
Seagreen(#2E8B57)
Sienna(#A0522D)
Silver(#ffc8ff)
Skyblue(#87CEEB)
Slateblue(#6A5ACD)
Slategray(#708090)
Springgreen(#00FF7F)
Steelblue(#468264)
Tan(#D2B48C)
teal(#008080)
Thistle(#D8BFD8)
Tomato(#FF6347)
Turquoise(#40E0D0)
Violet(#EE82EE)
Wheat(#F5DEB3)
White(#ffffff)
Yellowgreen(#9ACD32)
Yellow(#ffff00)

Klik disini untuk melanjutkan »»
.

Dasar-dasar HTML I

Kali ini kita akan ngerefresh sejenak ingatan kita mengenai HTML. Yah, artikel ini mungkin cocok buat yang baru mendalami pemrograman web.
HTML atau Hyper Text Markup Language. Adalah bahasa yang digunakan untuk mendisain dan
memformat halaman web. Kita mungkin sudah mendengar tentang bahasa program seperti C,
C++, Java, dan Visual basic. Masing-Masing bahasa ini terdiri dari perintah sintak
dan programming . Sintak ini adalah yang programmer gunakan untuk memanggil kode.
Sangatlah penting mengetahui bagaimana cara menulis kode menggunakan bahassa yang
relevan.
Lebih dari itu, kita harus konvensional dengan aturan menyangkut bahasa tertentu.

Didalam HTML, sintak ini disebut tag.Tag ditulis dengan tanda-kurung bersudut< dan
>.Ada kelompok tag yang sudah dikenal didalam HTML, yang mana digunakan untuk berbagai tujuan.
Sebagai contoh, dalam rangka memodifikasi satu baris teks ke dalam Bold, kita menerapkan
tag bold dengan suatu tag , kemudian tulis beberapa teks atau suatu paragrap yang
berisi beberapa teks,dan tutup tag menggunakan tag
seperti dalam contoh listing 1.

Semua tag didalam HTML harus ditutup menggunakan sintak .Tetapi ada beberapa perkecualian pada aturan ini, yang mana kita akan mendiskusikanya nanti.Kita memakai tag ini
sebab HTML bukanlah bahasa yang sensitip seperti C++ dan Java.

Struktur

Setiap kode HTML perlu ditulis dalam suatu struktur yang mana dapat dihubungkan dengan
Word Wide Web.Tidaklah wajib untuk mengikuti struktur ini. Bagaimanapun juga,lebih
baik
mempraktekan langsung struktur ini sbg perancangan halaman web kita.
Listing 1 menunjukkan struktur suatu halaman HTML sederhana:

Listing 1



<br /> Welcome to HTML <br />



Yang ditampilkan di browser, cuma tulisan ini.

Kode diatas menggunakan Notepad dan menyimpan file sebagai satu.html. Kemudian, klik kanan file yang disimpan tadi. bagaimanakah keluarannya?

Listing 2

Untuk menampilkan tulisan cetak tebal

Untuk menampilkan tulisan cetak miring (italic)

Untuk menampilkan tulisan bergaris bawah (underline)


digunakan untuk menampilkan baris baru.

Listing 3

Bla bla bla bla, dan tulisan ini pun akan dianggap satu paragraf. kalau ga percaya, coba aja sendiri. dengan menggunakannya dua kali atau lebih bakal lebih keliatan hasilnya.

Tidak wajib untuk menutup tag

. Tetapi seperti dikatakan sebelumnya, menutup
tiap-tiap tag adalah suatu yang baik yang pemprogram praktekkan.

Listing 4

Bekerja dengan Heading
Kita dapat menggunakan heading untuk mengorganisir teks kita dalam berbagai
tingkatan. Ada lima tingkatan heading didalam HTML seprti di bawah:

Level - 1


Level - 2


Level - 3


Level - 4


Level - 5

Listing 5

Penempatan List contoh teks atau items.Ada dua jenis list didalam HTML.
sebagai berikut

o Ordered List
o Unordered List

Ordered List diwakili oleh tag

    tag secara otomatis menomori, dan
    Unordered List diwakili oleh tag
      dan terlihat seperti bullet.
      Cobalah kode di bawah ini:


      1. Java
      2. C++

      kode diatas menghasilkan suatu daftar perintah bahasa. Jika kita
      menginginkannya seperti bullet kemudian kita ubah tag

        menjadi tag

          sebagai di bawah ini:

          Listing 6


          • Java
          • C++

          Listing 7
          Penerapan Definisi List

          Definisi List adalah serupa dengan daftar kata. Diterapkan menggunakan tag


          dan
          seperti ditunjukkan listing 7 dibawah ini.


          Java
          Developed by Sun Microsystems Inc
          Yang kedua
          Developed by saya sendiri

          Listing 8
          Indenting Text
          Tag

          yaitu teks yang menjorok lebih kedalam dari garis tepi secara
          otomatis dari kiri ke kanan. Cobalah contoh berikut :


          You can use Sound Recorder to record, play, and edit sound files.
          To use Sound Recorder, you must have a sound card and speakers
          installed on your computer. If you want to record live sound,
          you also need a microphone.

          Membuat Links

          Suatu website bukanlah halaman tunggal.Terdiri dari beberapa halaman yang saling
          berhubungan. Sebagai contoh,ketika kita klik suatu link nama ” About Us”,
          pada browser secara otomatis Kita ke halaman web itu .
          Bagaimana sihir ini terjadi? Itu merupakan suatu konsep Hyperlinks

          Kita dapat menciptakan Hyperlinks menggunakan tag .Dan harus ditutup menggunakan
          tag
          dan itu mewakili anchor.

          Listing 9

          Rumahweb

          href adalah suatu atribut yang digunakan untuk menetapkan link dan mewakili
          Teks Reference. Atribut lain meliputi suatu target opsional, yang mana menandakan
          bagaimana cara membuka link. Nilai atribut ini jadi kosong. Sebagai contoh,
          kode berikut memanggil lokasi Rumahweb.com didalam suatu jendela browser baru
          ketika seseorang mengklik teks.

          Listing 10

          Rumahweb

          Selalu ingat untuk menyimpan file yang telah dibuat dalam ekstensi .html

          Klik disini untuk melanjutkan »»
 

Pengikut

About Me

{assoka jepara} is proudly powered by dirubah oleh assoka | Template by Agus Ramadhani | assoka