Folder on Maskibow
 : CSS Syntaks

My Posting
CSS Syntaks - On Maskibow

CSS Syntaks

Sintaks CSS adalah sebagai berikut:

Selector {
properti: nilai;
...
}

Ada tiga jenis utama Selector: type Selector, Selector Class, dan Selector ID.
Selektor Type yang ada dan sering digunakan pada HTML tag seperti body <body>, paragrap <p> dan head <h1>. Class dan ID penyeleksi yang ditetapkan sebagai pengguna penyeleksi. Kita akan membahas kedua jenis selektor lebih terinci pada bagian selanjutnya. Gaya yang biasanya ditentukan dalam properti. Sebagai contoh, jika kita ingin menentukan bahwa elemen tertentu memiliki warna, kita menggunakan properti berikut: deklarasi nilai

Contoh Penulisan kode class:
<style>
.sintakscss1{color: red;}
</style>

<div class="sintakscss1">
CSS Sample
</div>

Contoh Tampilan:
CSS Sample

Contoh Penulisan kode id:
<style>
#sintakscss1{color: lime;}
</style>

<div id="sintakscss1">
CSS Sample
</div>

Contoh Tampilan:
CSS Sample

PENGELOMPOKAN

Jika beberapa selektor CSS berbagi sifat yang sama, mereka dapat digunakan bersama-sama. Ini disebut "pengelompokan". Misalnya, jika <h1>, <h2>, dan berbagi <h3> mereka gaya yang sama, mereka dapat dideklarasikan bersama sebagai berikut:

Contoh Penulisan kode class:
<style>
h1, h2, h3{color: red;}
</style>

<h1>
CSS Sample
</h1>
<h2>
CSS Style
</h2>
<h3>
CSS Tutorial
</h3>

Contoh Tampilan:
CSS Sample
CSS Style
CSS Tutorial

SELEKTOR KETURUNAN

Kita dapat menentukan gaya elemen hanya ketika berada di dalam elemen lain. Untuk mencapai hal ini, kita menggunakan konsep selektor keturunan.

Sintaks untuk mendeklarasikan pemilih keturunan adalah:

[Parent Selectors] [Anak Selectors] {
properti: nilai;
...
}

Gaya didefinisikan di atas akan berlaku untuk penyeleksi anak hanya ketika mereka berada di dalam pemilih induk. Deklarasi tersebut dapat berlangsung selama lebih dari dua tingkat.

Sebagai contoh, dalam deklarasi di bawah ini :

Contoh Penulisan kode class:
<style>
h5 .sample1{color: purple;}
h5 .sample2{color: blue;}
h5 .sample3{color: orange;}
</style>
<h5>
<div class="sample1">
CSS Sample
</div>
<div class="sample2">
CSS Sample
</div>
<div class="sample3">
CSS Sample
</div>
</h5>

Contoh Tampilan:
CSS Sample
CSS Sample
CSS Sample


berarti bahwa teks dalam elemen <sample1>, <sample2>, <sample3> yang berada didalam elemen <h5> akan memiliki warna yang ditentukan. Teks dalam elemen <sample1>, <sample2>, <sample3> tidak dalam elemen <h5> tidak akan terpengaruh oleh stylesheet ini.

Label: , , ,


Share This Page !!!


Artikel Lainnya :

Loading...

Komentar : 1 Komentar

What the Next??




Sintaks CSS adalah sebagai berikut:

Selector {
properti: nilai;
...
}

Ada tiga jenis utama Selector: type Selector, Selector Class, dan Selector ID.
Selektor Type yang ada dan sering digunakan pada HTML tag seperti body <body>, paragrap <p> dan head <h1>. Class dan ID penyeleksi yang ditetapkan sebagai pengguna penyeleksi. Kita akan membahas kedua jenis selektor lebih terinci pada bagian selanjutnya. Gaya yang biasanya ditentukan dalam properti. Sebagai contoh, jika kita ingin menentukan bahwa elemen tertentu memiliki warna, kita menggunakan properti berikut: deklarasi nilai

Contoh Penulisan kode class:
<style>
.sintakscss1{color: red;}
</style>

<div class="sintakscss1">
CSS Sample
</div>

Contoh Tampilan:
CSS Sample

Contoh Penulisan kode id:
<style>
#sintakscss1{color: lime;}
</style>

<div id="sintakscss1">
CSS Sample
</div>

Contoh Tampilan:
CSS Sample

PENGELOMPOKAN

Jika beberapa selektor CSS berbagi sifat yang sama, mereka dapat digunakan bersama-sama. Ini disebut "pengelompokan". Misalnya, jika <h1>, <h2>, dan berbagi <h3> mereka gaya yang sama, mereka dapat dideklarasikan bersama sebagai berikut:

Contoh Penulisan kode class:
<style>
h1, h2, h3{color: red;}
</style>

<h1>
CSS Sample
</h1>
<h2>
CSS Style
</h2>
<h3>
CSS Tutorial
</h3>

Contoh Tampilan:
CSS Sample
CSS Style
CSS Tutorial

SELEKTOR KETURUNAN

Kita dapat menentukan gaya elemen hanya ketika berada di dalam elemen lain. Untuk mencapai hal ini, kita menggunakan konsep selektor keturunan.

Sintaks untuk mendeklarasikan pemilih keturunan adalah:

[Parent Selectors] [Anak Selectors] {
properti: nilai;
...
}

Gaya didefinisikan di atas akan berlaku untuk penyeleksi anak hanya ketika mereka berada di dalam pemilih induk. Deklarasi tersebut dapat berlangsung selama lebih dari dua tingkat.

Sebagai contoh, dalam deklarasi di bawah ini :

Contoh Penulisan kode class:
<style>
h5 .sample1{color: purple;}
h5 .sample2{color: blue;}
h5 .sample3{color: orange;}
</style>
<h5>
<div class="sample1">
CSS Sample
</div>
<div class="sample2">
CSS Sample
</div>
<div class="sample3">
CSS Sample
</div>
</h5>

Contoh Tampilan:
CSS Sample
CSS Sample
CSS Sample


berarti bahwa teks dalam elemen <sample1>, <sample2>, <sample3> yang berada didalam elemen <h5> akan memiliki warna yang ditentukan. Teks dalam elemen <sample1>, <sample2>, <sample3> tidak dalam elemen <h5> tidak akan terpengaruh oleh stylesheet ini.

Label: , , ,

Sintaks CSS adalah sebagai berikut:

Selector {
properti: nilai;
...
}

Ada tiga jenis utama Selector: type Selector, Selector Class, dan Selector ID.
Selektor Type yang ada dan sering digunakan pada HTML tag seperti body <body>, paragrap <p> dan head <h1>. Class dan ID penyeleksi yang ditetapkan sebagai pengguna penyeleksi. Kita akan membahas kedua jenis selektor lebih terinci pada bagian selanjutnya. Gaya yang biasanya ditentukan dalam properti. Sebagai contoh, jika kita ingin menentukan bahwa elemen tertentu memiliki warna, kita menggunakan properti berikut: deklarasi nilai

Contoh Penulisan kode class:
<style>
.sintakscss1{color: red;}
</style>

<div class="sintakscss1">
CSS Sample
</div>

Contoh Tampilan:
CSS Sample

Contoh Penulisan kode id:
<style>
#sintakscss1{color: lime;}
</style>

<div id="sintakscss1">
CSS Sample
</div>

Contoh Tampilan:
CSS Sample

PENGELOMPOKAN

Jika beberapa selektor CSS berbagi sifat yang sama, mereka dapat digunakan bersama-sama. Ini disebut "pengelompokan". Misalnya, jika <h1>, <h2>, dan berbagi <h3> mereka gaya yang sama, mereka dapat dideklarasikan bersama sebagai berikut:

Contoh Penulisan kode class:
<style>
h1, h2, h3{color: red;}
</style>

<h1>
CSS Sample
</h1>
<h2>
CSS Style
</h2>
<h3>
CSS Tutorial
</h3>

Contoh Tampilan:
CSS Sample
CSS Style
CSS Tutorial

SELEKTOR KETURUNAN

Kita dapat menentukan gaya elemen hanya ketika berada di dalam elemen lain. Untuk mencapai hal ini, kita menggunakan konsep selektor keturunan.

Sintaks untuk mendeklarasikan pemilih keturunan adalah:

[Parent Selectors] [Anak Selectors] {
properti: nilai;
...
}

Gaya didefinisikan di atas akan berlaku untuk penyeleksi anak hanya ketika mereka berada di dalam pemilih induk. Deklarasi tersebut dapat berlangsung selama lebih dari dua tingkat.

Sebagai contoh, dalam deklarasi di bawah ini :

Contoh Penulisan kode class:
<style>
h5 .sample1{color: purple;}
h5 .sample2{color: blue;}
h5 .sample3{color: orange;}
</style>
<h5>
<div class="sample1">
CSS Sample
</div>
<div class="sample2">
CSS Sample
</div>
<div class="sample3">
CSS Sample
</div>
</h5>

Contoh Tampilan:
CSS Sample
CSS Sample
CSS Sample


berarti bahwa teks dalam elemen <sample1>, <sample2>, <sample3> yang berada didalam elemen <h5> akan memiliki warna yang ditentukan. Teks dalam elemen <sample1>, <sample2>, <sample3> tidak dalam elemen <h5> tidak akan terpengaruh oleh stylesheet ini.

Label: , , ,

8 stars -10 stars -11 KomentarOver 1,500,000
4 stars- Sintaks CSS adalah sebagai berikut:

Selector {
properti: nilai;
...
}

Ada tiga jenis utama Selector: type Selector, Selector Class, dan Selector ID.
Selektor Type yang ada dan sering digunakan pada HTML tag seperti body <body>, paragrap <p> dan head <h1>. Class dan ID penyeleksi yang ditetapkan sebagai pengguna penyeleksi. Kita akan membahas kedua jenis selektor lebih terinci pada bagian selanjutnya. Gaya yang biasanya ditentukan dalam properti. Sebagai contoh, jika kita ingin menentukan bahwa elemen tertentu memiliki warna, kita menggunakan properti berikut: deklarasi nilai

Contoh Penulisan kode class:
<style>
.sintakscss1{color: red;}
</style>

<div class="sintakscss1">
CSS Sample
</div>

Contoh Tampilan:
CSS Sample

Contoh Penulisan kode id:
<style>
#sintakscss1{color: lime;}
</style>

<div id="sintakscss1">
CSS Sample
</div>

Contoh Tampilan:
CSS Sample

PENGELOMPOKAN

Jika beberapa selektor CSS berbagi sifat yang sama, mereka dapat digunakan bersama-sama. Ini disebut "pengelompokan". Misalnya, jika <h1>, <h2>, dan berbagi <h3> mereka gaya yang sama, mereka dapat dideklarasikan bersama sebagai berikut:

Contoh Penulisan kode class:
<style>
h1, h2, h3{color: red;}
</style>

<h1>
CSS Sample
</h1>
<h2>
CSS Style
</h2>
<h3>
CSS Tutorial
</h3>

Contoh Tampilan:
CSS Sample
CSS Style
CSS Tutorial

SELEKTOR KETURUNAN

Kita dapat menentukan gaya elemen hanya ketika berada di dalam elemen lain. Untuk mencapai hal ini, kita menggunakan konsep selektor keturunan.

Sintaks untuk mendeklarasikan pemilih keturunan adalah:

[Parent Selectors] [Anak Selectors] {
properti: nilai;
...
}

Gaya didefinisikan di atas akan berlaku untuk penyeleksi anak hanya ketika mereka berada di dalam pemilih induk. Deklarasi tersebut dapat berlangsung selama lebih dari dua tingkat.

Sebagai contoh, dalam deklarasi di bawah ini :

Contoh Penulisan kode class:
<style>
h5 .sample1{color: purple;}
h5 .sample2{color: blue;}
h5 .sample3{color: orange;}
</style>
<h5>
<div class="sample1">
CSS Sample
</div>
<div class="sample2">
CSS Sample
</div>
<div class="sample3">
CSS Sample
</div>
</h5>

Contoh Tampilan:
CSS Sample
CSS Sample
CSS Sample


berarti bahwa teks dalam elemen <sample1>, <sample2>, <sample3> yang berada didalam elemen <h5> akan memiliki warna yang ditentukan. Teks dalam elemen <sample1>, <sample2>, <sample3> tidak dalam elemen <h5> tidak akan terpengaruh oleh stylesheet ini.

Label: , , ,

Maskibow



Choose Your Language
Fast Translate :

Link Tutorial
HTML TAG
JavaScript Properties
Excel Function
Sample Button Menu
Sample Tooltip
CSS Properties
Visitor On Site's

Contributor