pengertian css dan cara penerapan css pada html

3

Click here to load reader

Upload: wening-tyas-suminar

Post on 07-Apr-2016

8 views

Category:

Documents


2 download

DESCRIPTION

css

TRANSCRIPT

Page 1: Pengertian CSS Dan Cara Penerapan CSS Pada HTML

Pengertian CSS dan Cara Penerapan CSS pada HTML | W3function.com Indonesian Web Design and Development Studio

http://www.w3function.com/blog/?p=det&idn=31 2/12

Pada artikel saya kali ini saya akan menjelaskan pertanyaan rekan pixar ataupun yang lainnya tentang CSS. Apa yang dimaksud dengan CSS dan

bagaimana cara menerapkannya pada website?! CSS adalah singkatan dari Cascading Style Sheet, digunakan untuk mengatur style atau tampilan

dari dokumen HTML.

CSS (Cascading Style Sheet) dibuat oleh World Wide Web Consortium (W3C) untuk menyelesaikan masalah yang timbul pada saat dokumen

HTML masih versi 3.2. HTML versi 3.2 ini merupakan mimpi buruk untuk para Pengembang Web karena untuk memberi style pada document

HTML para pengembang harus membuat tagtag tersendiri misalkan tag <font>, tag atribut warna <color> dan lain sebagainya pada setiap

dokumen HTML yang akhirnya membuat pengembangan web dengan skala besar menjadi lebih kompleks, rumit dan mahal.

Mengapa harus memakai CSS?!

Penggunaan CSS merupakan standar untuk webweb modern (Web 2.0). Sebagian pembaca mungkin sudah tau bahwa implementasi CSS, Table

Less dan Semantik tapi tidak Divitis (maniak div) merupakan standarisasi web yang baik. Saya sendiri sebetulnya tidak peduli apakah CSS adalah

Standar Web ataupun Bukan, menurut saya kita memang harus melakukan implementasi CSS untuk setiap perancangan website kita karena

dengan CSS kita tidak akan melakukan halhal yang terus diulangi dalam menerapkan suatu gaya pada tag HTML yang kita buat, cukup satu kode

untuk semua mark up yang sama.

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

Page 2: Pengertian CSS Dan Cara Penerapan CSS Pada HTML

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 <style type="text/css" media="screen"> pada bagian header tag HTML

kita. Setelah selesai menambahkan tag maka selanjutnya tag tersebut kita tutup lagi dengan </style> sehingga kode HTML menjadi sebagai

berikut

Ok, sekarang anda paham kan dimana kita harus menerap

1

2

3

4

5

6

7

8

9

10

11

<html>

<head>

<title>Belajar CSS</title>

<style type="text/css">

<! disini kode CSS >‐‐ ‐‐

Page 3: Pengertian CSS Dan Cara Penerapan CSS Pada HTML

</style>

</head>

<body>

<! disini content HTML >‐‐ ‐‐

</body>

</html>