Cara menggunakan atribut class html

HTML - HTML Dasar

Table of Contents Show

Belajar HTML Mengenal Class dan Id Pada HTML
Mengenal Class dan Id Pada HTML
Apa itu atribut class pada HTML?
Apa itu atribut class?
Apa bedanya ID dan class?
Apa fungsi class pada css?

By
9 January 2016
HTML HTML Dasar

Belajar HTML Mengenal Class dan Id Pada HTML

Class dan Id, sesuai dengan yang di jelaskan pada tutorial sebelumnya di belajar html part 16 : Menghubungkan HTML dengan CSS di jelaskan bahwa class dan id sangat lah penting. oleh sebab itu pada tutorial belajar HTML mengenal class dan id pada html ini akan di jelaskan tentang apa sih pengertian dari class dan id pada HTML, dan apa perbedaan dari class dan id pada HTML.

Class dan id bisa di bilang sebagai penanda pada html, maksud penanda di sini adalah element-element html dapat di beri tanda dengan class atau id. untuk apa di beri tanda ? agar dapat di manipulasi menggunakan css atau javascript. bayangan sederhananya jika anda memiliki lima buah kotak, semua kotak yang anda miliki berwarna biru, kemudian anda ingin mengubah warna kotak yang ketiga, nah di sinilah letak kegunaan class dan id, untuk memberikan tanda atau nama pada kotak anda agar bisa di ubah dan kotak yang lain tidak akan berubah.

Mengenal Class dan Id Pada HTML

Perbedaan dari class dan id adalah class di panggil pada css atau javascript dengan menggunakan tanda titik “.”, dan id di panggil pada css atau javascript dengan tanda pagar “#”, ada kelebihan di sini untuk class, yaitu class dapat di berikan pada banyak element html dan dapat di panggil sekaligus, sedangkan id hanya dapat bekerja pada satu penandaan saja, maksudnya satu nama id hanya bisa di berikan pada satu element saja, perhatikan pada contoh berikut untuk memberikan pemahaman lebih tentang class dan id pada html ini.

index.html

<!DOCTYPE html>

<html>

<head>

<title>Mengenal Class dan Id pada HTML| www.malasngoding.com</title>

</head>

<body>

<h2>Mengenal Class dan Id pada HTML<br/>www.malasngoding.com</h2>

<div class="kotak">kotak1</div>

<div class="kotak">kotak2</div>

<div class="kotak">kotak3</div>

<div id="kotak">Kotak4</div>

</body>

</html>

style.css

h2{

color:orange;

font-family:sans-serif;

text-align:center;

}

.kotak{

padding:50px;

width:100px;

color:#fff;

margin:10px;

background:orange;

}

#kotak{

width:400px;

color:#fff;

background:blue;

padding:50px;

}

dan jika di jalankan pada browser

Belajar HTML mengenal class dan id pada html

perhatikan pada contoh di atas, kotak 1, kotak 2 dan kotak 3 kita beri tanda dengan class yang kita beri nama “kotak”, dan kotak 4 kita beri tanda dengan id yang kita beri nama kotak juga. maka perbedaannya di sini akan tampak, bahwa class bisa di panggil sekaligus, ini di buktikan dengan kotak 1,2 dan 3 di beri tanda class yang sama yaitu class kotak. dan kotak 4 kita beri tanda dengan id kotak.

selanjutnya pada css juga dapat anda lihat, class di panggil dengan tanda titik “.” dan id di panggil dengan tanda pagar “#”.

See the Pen LGyJGO by Malas Ngoding (@malasngoding) on CodePen.0

Sekian penjelasan tentang belajar html mengenal class dan id pada html.

Tutorial HTML Dasar Lainnya

Belajar HTML Part 1 : Pengertian HTML
Belajar HTML Part 2 : Memilih Text Editor
Belajar HTML Part 3 : Mengenal Tag, Element, Atribut HTML
Belajar HTML Part 4 : Heading Pada HTML
Belajar HTML Part 5 : Format Text Pada HTML
Belajar HTML Part 6 : Membuat Paragraf Pada HTML
Belajar HTML Part 7 : Membuat Table Pada HTML
Belajar HTML Part 8 : Membuat Hyperlink Pada HTML
Belajar HTML Part 9 : Membuat List Pada HTML
Belajar HTML Part 10 : Membuat Format Code Pada HTML
Belajar HTML Part 11 : Membuat Form Pada HTML
Belajar HTML Part 12 : Atribut Form Pada HTML
Belajar HTML Part 13 : Membuat Symbol Pada HTML
Belajar HTML Part 14 :Menampilkan Gambar Pada HTML
Belajar HTML Part 15 : Tag Iframe Pada HTML
Belajar HTML Part 16 : Menghubungkan HTML dengan CSS
Belajar HTML Part 17 : Mengenal Class dan Id Pada HTML

Incoming search terms:

arti fff u1
perbedaan class dan id
fungsi div class
<div class=row>
fungsi div class pada html
fungsi class pada html
contoh class dan
class pada html
fungsi id pada html
fungsi class html

Apa itu atribut class pada HTML?

Atribut class berfungsi untuk menentukan nama class dari suatu elemen. Berbeda dengan id yang bersifat unik, class diperbolehkan untuk digunakan oleh lebih dari satu elemen yang ditandainya. Atribut class juga sering digunakan untuk menunjuk ke nama class pada lembar gaya (style sheet).

Apa itu atribut class?

Atribut class digunakan untuk mengelompokkan atau mengklasifikasi beberapa tag atau elemen HTML. Beberapa tag dapat menggunakan atribut class yang sama.

Apa bedanya ID dan class?

Apa fungsi class pada css?

Class adalah style dari CSS yang bisa digunakan untuk beberapa elemen, dengan adanya class ini memungkinkan anda untuk merubah beberapa objek pada html dengan settingan yang sama, dengan menuliskan satu perintah saja, class diawali dengan tanda titik (.).