iklan

Pengertian Css Dan Fungsinya

Pengertian CSS dan Fungsinya - Cascading Style Sheet (CSS) yakni hukum untuk mengatur beberapa komponen dalam sebuah web sehingga akan lebih terstruktur dan seragam. CSS bukan bahasa pemrograman.

Demikian pula gaya dalam aplikasi pengolah kata menyerupai Microsoft Word sanggup mengatur beberapa gaya, menyerupai judul, subtab, bodytext, footer, gambar, dan gaya lainnya untuk dipakai bersama dalam beberapa file.

Secara umum, CSS dipakai untuk memformat tampilan halaman web yang dibentuk dengan bahasa HTML dan XHTML.

 yakni hukum untuk mengatur beberapa komponen dalam sebuah web sehingga akan lebih terst Pengertian CSS dan Fungsinya
CSS


Baca juga: Pengertian HTML dan Fungsinya

CSS sanggup mengontrol ukuran gambar, warna bab tubuh pada teks, warna tabel, ukuran border, warna border, warna hyperlink, warna mouse over, jarak antar paragraf, spasi antara teks, kiri, kanan, atas, bawah, dan parameter lainnya.

CSS yakni bahasa style sheet yang dipakai untuk mengatur tampilan dokumen. Dengan CSS memungkinkan kita untuk menampilkan halaman yang sama dengan format yang berbeda.

Sejarah CSS
Nama CSS berasal dari fakta bahwa setiap deklarasi gaya yang berbeda sanggup ditempatkan secara berurutan, yang lalu membentuk hubungan orang tua-anak di setiap gaya.

CSS sendiri merupakan teknologi internet yang direkomendasikan oleh World Wide Web Consortium atau W3C pada tahun 1996.

Setelah CSS distandarisasikan, Internet Explorer dan Netscape memutus peramban standar CSS terbaru mereka atau setidaknya mendekati.

Versi CSS
Untuk dikala ini ada tiga versi CSS, yaitu CSS1, CSS2, dan CSS3. CSS1 dikembangkan berpusat pada format dokumen HTML, CSS2 dikembangkan untuk memenuhi kebutuhan akan format dokumen yang akan ditampilkan pada printer, sedangkan CSS3 yakni versi terbaru dari CSS yang bisa melaksanakan banyak hal dalam desain website.

CSS2 mendukung posisi konten, d0wnl0ad, abjad huruf, tata letak tabel / tabel dan tampilan jenis media untuk printer. Kehadiran versi CSS kedua dibutuhkan lebih baik dari versi pertama dan kedua.

CSS3 juga bisa melaksanakan animasi di halaman website, termasuk animasi animasi warna ke 3D. Dengan desainer CSS3 lebih gampang dalam hal kompatibilitas situs web pada smartphone dengan kontribusi fitur gres dari kueri media.

Selain itu, banyak fitur gres di CSS3 seperti: multiple background, border-radius, drop-shadow, border-image, CSS Math, dan CSS Object Model.

Penulisan CSS
Saat login ke bab CSS, kita sering menemukan aba-aba berikut:

h1 {
warna: # 0789de;
}
Bagian pertama sebelum '{}' disebut selector, sedangkan yang dilampirkan oleh '{}' disebut deklarasi yang terdiri dari dua elemen, properti dan nilainya. Pemilih dalam pernyataan di atas yakni h1, sedangkan warnanya yakni properti, dan # 0789de yakni nilainya.

Selain itu ada tiga metode penulisan atribut CSS, yaitu:

Lembar Gaya Inline
CSS didefinisikan secara eksklusif dalam tag HTML yang sesuai. Cara penulisannya yakni dengan menambahkan atribut style = "..." pada tag HTML. Style hanya akan berlaku untuk tag yang dimaksud, dan tidak akan menghipnotis tag HTML lainnya.

Contoh penulisan CSS dengan metode Inline Style Sheet:

<html>
<head>
<title> Contoh Bentuk Inline </ title>
</ head>
<body bgcolor = "# FFFFFF">
<p id = "cth1">

Ini yakni rujukan tag P dengan kehormatan memakai CSS </ p>

<p id = "cth2" style = "font-size: 20pt">
Tag P ini diformat dengan font 20 titik yang besar </ p>

<p id = "cth3" style = "font-size: 14pt; color: red">
Tag P ini diformat dengan font 14 titik, dan memakai warna merah </ p>
</ body>
</ html>

Lembar Gaya Tertanam
CSS didefinisikan pertama kali di tag <style> ... </ style> di atas tag <body>. Dalam definisi ini atribut CSS dipakai untuk tag HTML, yang lalu sanggup dipakai oleh tag HTML yang sesuai.

Contoh penggunaan CSS dengan metode Sheet Material Tertanam:

<html>
<head>
<title> Contoh Bentuk Tertanam </ title>
</ head>
<style>
tubuh {background: # 0000FF; warna: # FFFF00; margin-left: 0.5in}
h1 {font-size: 18pt; warna: # FF0000}
p {font-size: 12pt; font-family: arial; text-indent: 0.5in}
</ style>

<body>
<h1 id = "cth1"> Judul ini berwarna 18 merah </ h1>
<p id = "cth2"> Tag p ini diformat dengan font 12 titik dengan tipe font Arial dan mempunyai pengenal 0,5 inci </ p>
<p id = "cth3"> Perhatikan juga bahwa bodi di sini telah diformat dengan margin kiri 0,5 inci dan warna latar belakang biru </ p>
</ body>
</ html>

Sifat CSS
Ada dua properti CSS yang bersifat internal dan eksternal. Jika internal dipilih, maka naskah tersebut disisipkan eksklusif ke halaman website yang akan dirancang.

Jika halaman web lain akan dirancang dengan model yang sama, maka script CSS harus dimasukkan kembali ke halaman web lain.

Properti kedua yakni eksternal dimana script CSS dipisahkan dan ditempatkan pada file khusus. Nantinya, cukup gunakan beberapa jenis link ke file CSS kalau halaman web yang dirancang akan dibentuk menyerupai model dalam script.

Fakta Menggunakan CSS
Fakta Menggunakan CSS meliputi:

Ini didukung oleh sebagian besar versi browser yang lebih baru, namun tidak didukung oleh peramban lawas.

Lebih fleksibel dalam penempatan penempatan posisi. Dalam tata letak CSS, kita mengenali Z-Index untuk menempatkan objek pada posisi yang sama.

Menjaga HTML dalam penggunaan tag minimal, ini menghipnotis ukuran file dan kecepatan d0wnl0ad.
Bisa menampilkan konten utama terlebih dahulu, sementara gambar bisa ditampilkan sesudahnya.

Terjemahan CSS masing-masing browser berbeda, tata letaknya akan berubah bila dilihat di aneka macam browser CSS yakni layouting "The Future" dengan menggabungkan dengan XHTML.


Contoh File CSS

<html>
<head>
<style type = "text / css">
tubuh
{
background-color: # d0e4fe;
}
h1
{
warna oranye;
text-align: center;
}
hal
{
font-family: "Times New Roman";
ukuran huruf: 20px;
}
</ style>
</ head>

<body>
<h1> rujukan CSS! </ h1>
<p> Ini yakni paragraf. </ p>

</ body>
</ html>
Sumber http://www.pintarkomputer.org/

Berlangganan update artikel terbaru via email:

0 Response to "Pengertian Css Dan Fungsinya"

Posting Komentar

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel