Apasih CSS itu??????

Apasih CSS itu??????

Apa yang dimaksud dengan CSS?

CSS adalah singkatan dari Cascading Style Sheet, digunakan untuk mengatur style atau tampilan dari dokumen HTML. CSS adalah suatu bahasa stylesheet yang digunakan untuk mengatur tampilan suatu website, baik tata letak, jenis huruf, warna, dan semua yang berhubungan dengan tampilan atau gaya suatu web.

Lalu bagaimana teknik implementasi CSS pada tag HTML yang kita buat?!

Ada dua cara yang bisa diterapkan untuk menggunakan CSS pada web. Cara yang pertama adalah dengan membuat CSS langsung didalam satu file HTML kita (internal / inline style sheet). Cara yang kedua adalah dengan cara memanggil CSS tersebut dari file CSS tersendiri (external style sheet). selanjutnya mari kita langsung praktek silahkan buka dreamweaver anda atau text editor, dsb :

1. Internal Style Sheet

Cara membuat internal Style Sheet adalah dengan menambahkan tag sehingga kode HTML menjadi sebagai berikut

2. External Style Sheet

Menuliskan Mark up CSS untuk external Style Sheet sama saja dengan cara diatas, bedanya penulisan Markup tidak ditempatkan didalam HTML melainkan dibuat file sendiri dengan ekstensi .css, Silahkan buat file text baru kemudian save as style.css dan simpan di direktori yang sama.

Langkah selanjutnya buat markup sebagai berikut pada file style.css yang baru kita buat

body {

        padding-left: 11em;

        font-family: Georgia, "Times New Roman", Times, serif;

        color: white;

        background-color: #555555 }

ul.navbar {

        list-style-type: none;

        padding: 0;

        margin: 0;

        position: absolute;

        top: 2em;

        left: 1em;

        width: 9em }

ul.navbar li {

        background: white;

        margin: 0.5em 0;

        padding: 0.3em;

        border-right: 1em solid #FF6600 }

ul.navbar a {

        text-decoration: none }

h1 {

        font-family: Helvetica, Geneva, Arial,

        Sans-Regular, sans-serif }

a:link {

        color: #00CC66 }

a:visited {

        color: purple }

address {

        margin-top: 1em;

        padding-top: 1em;

        border-top: thin dotted }

Untuk menghubungkan file HTML dengan CSS maka pada tag header HTML diganti menjadi sebagai berikut :

penerapan external maupun internal CSS yang saya jelaskan diatas akan menghasilkan dokumen web dengan gaya yang sama

Coding CSS untuk membuat background:

1.

My CSS web page!

Hello world! This is a W3Schools.com example.

2.

Hello World!

Now the background image is only show once, and positioned away from the text.

In this example we have also added a margin on the right side, so the background image will never disturb the text.