People Innovation Excellence

Pengenalan CSS

CSS pertama kali bermula sejak munculnya SGML pada tahun 1970an. Sejak kemunculannya tersebut, CSS mengalami perkembangan yang sangat pesat. Format dasar CSS yang banyak kita gunakan sekarang ini merupakan ide dari seoang programmer bernama Hakon Wium Lie yang tertuang dalam proposalnya mengenai Cascading HTML Style Sheet (CHSS) pada bulan Oktober 1994 (dalam konferensi W3C di Chicago, Illinois). Kemudian, beliau bersama-sama dengan seorang temannya yang bernama Bert Bos mengembangkan suatu standard CSS.

Pada akhir tahun 1996, CSS telah resmi dipublikasikan (dan menyusul kemudian CSS Level 1 pada bulan Desember). Pengerjaan proyek ini juga didukung oleh seorang programmer bernama Thomas Reardon dari perusahaan software ternama, Microsoft. Cascading Style Sheet (CSS) merupakan aturan untuk mengatur beberapa komponen dalam sebuah web sehingga akan lebih terstruktur dan seragam. CSS bukan merupakan bahasa pemograman.

Sama halnya styles dalam aplikasi pengolahan kata seperti Microsoft Word yang dapat mengatur beberapa style, misalnya headingsubbabbodytextfooterimages, dan style lainnya untuk dapat digunakan bersama-sama dalam beberapa berkas (file). Pada umumnya CSS dipakai untuk memformat tampilan halaman web yang dibuat dengan bahasa HTML dan XHTML.

CSS dapat mengendalikan ukuran gambarwarna bagian tubuh pada teks, warna tabel, ukuran border, warna border, warna hyperlink, warna mouse over, spasi antar paragraf, spasi antar teks, margin kiri, kanan, atas, bawah, dan parameter lainnya. CSS adalah bahasa style sheet yang digunakan untuk mengatur tampilan dokumen. Dengan adanya CSS memungkinkan kita untuk menampilkan halaman yang sama dengan format yang berbeda.

Sekarang penggunaan CSS telah semakin meluas dan terus dikembangkan. Hal ini juga akan mempermudah seorang web designer dalam mengembangkan suatu halaman web (situs).
Ada 3 cara untuk memasang Script CSS pada dokumen HTML yaitu:

  • Inline Style Sheet (Kode CSS langsung dipasang di tag HTML, tidak direkomendasikan),
  • Internal Style Sheet (Kode CSS dipasang di dalam tag head HTML),
  • External Style Sheet (file CSS berbeda dari file HTML).

Berikut contoh pemasangan Script CSS pada dokumen HTML :

  • Inline Style Sheet :

<html>

<head>

                <title>Hello World</title>

</head>

<body>

                <a href=”” style=”font-size: 20px; font-family: Calibri;”>Hello World!</a>

</body>

</html>

  • Internal Style Sheet :

<html>

<head>

                <title>Hello World</title>

                <style type=”text/css”>

                                a{

                                                font-size: 20px;

                                                color: blue;

                                }

                </style>

</head>

<body>

                <a href=””>Hello World!</a>

</body>

</html>

  • External Style Sheet : Di External Style Sheet ini di pisahkan antara file CSS dan HTML-nya

HTML file :

<html>

<head>

                <title>Hello World</title>

                <link rel=”stylesheet” type=”text/css” href=”style.css”>

</head>

<body>

                <a href=””>Hello World!</a>

</body>

</html>

CSS file :

a{

                text-decoration: none;

                color: blue;

                font-size: 20px;

}


Published at :
Leave Your Footprint

    Periksa Browser Anda

    Check Your Browser

    Situs ini tidak lagi mendukung penggunaan browser dengan teknologi tertinggal.

    Apabila Anda melihat pesan ini, berarti Anda masih menggunakan browser Internet Explorer seri 8 / 7 / 6 / ...

    Sebagai informasi, browser yang anda gunakan ini tidaklah aman dan tidak dapat menampilkan teknologi CSS terakhir yang dapat membuat sebuah situs tampil lebih baik. Bahkan Microsoft sebagai pembuatnya, telah merekomendasikan agar menggunakan browser yang lebih modern.

    Untuk tampilan yang lebih baik, gunakan salah satu browser berikut. Download dan Install, seluruhnya gratis untuk digunakan.

    We're Moving Forward.

    This Site Is No Longer Supporting Out-of Date Browser.

    If you are viewing this message, it means that you are currently using Internet Explorer 8 / 7 / 6 / below to access this site. FYI, it is unsafe and unable to render the latest CSS improvements. Even Microsoft, its creator, wants you to install more modern browser.

    Best viewed with one of these browser instead. It is totally free.

    1. Google Chrome
    2. Mozilla Firefox
    3. Opera
    4. Internet Explorer 9
    Close