Selector CSS ~ Take Knowledge

Selector pada CSS berguna untuk memanggil tag - tag yang ada pada html seperti <h1> <p> <div>, dll, sehingga memudahkan seorang programmer web merancang tampilan dari web tersebut. Adapun beberapa hal dasar yang harus dipahami dalam membahas selector pada CSS adalah sebagai berikut :

Untuk menselect dapat menggunakan tag HTML.
Untuk menselect sebuah tag yang pada CSS dikhususkan gunakanlah atribut ID dan Class.
Untuk menselect sebuah ID diawali dengan simbol # (pagar).
ID hanya dapat digunakan sekali pada tag pertama dan hanya untuk dirinya saja.
Untuk menselect sebuah Class diawali dengan simbol . (titik).
Class dapat digunakan untuk untuk banyak tag.
Penamaan untuk ID tidak boleh menggunakan (Spasi) setelah kata pertama, untuk membuat ID dengan menggunakan 2 kata, gunakanlah tanda (_) sebagai pemisahnya, hal ini dikarenkan Atribut ID pada html hanya mengenal 1 data saja.
Penamaan untuk Class boleh saja menggunakan spasi sebagai pemisahnya, akan tetapi kata setelah spasi akan dihitung/terbaca oleh CSS sebagai class kedua.

Untuk lebih jelasnya dapat melihat code dibawah ini :

	<html>
	<head>
	<title> Learn Selector</title>
	<style type="text/css">
	#head1{
	font-size: 40px;
	font-family: comic sans ms;
	}

	#head2,#head3{
	color: #52B3D9;
	}

	h4 {
	text-align: center;
	}

	.data{
	font-style: italic;
	color: #87D37C;
	}

	.info{
	font-size: 30px;
	font-family: verdana;
	}
	</style>
	</head>
	<body>
	<h1 id="head1">This is a heading pertama</h1>
	<h2 id="head2">This is a heading kedua</h2>
	<h3 id="head3">This is a heading ketiga</h3>
	<h4 id="head3">This is a heading keempat</h4>

	<p class="data">
	This is a paragraph pertama. here are many variations of passages of Lorem Ipsum available,
	but the majority have suffered alteration in some form, by injected humour, </p>

	<p class="data info">
	This is a paragraph kedua. here are many variations of passages of Lorem Ipsum available,
	but the majority have suffered alteration in some form, by injected humour, </p>
	</body>
	</html>

view raw learn_selectors.html hosted with ❤ by GitHub

Pada code diatas hal pertama yang harus benar - benar diperhatikan adalah, masukanlah tag <style> ..... </style> diantara tag <head> ..... </head> seluruhnya mengikuti instruksi bagaiamana cara menggunakan selector pada CSS pada hal - hal yang harus dipahami diatas, jadi jika ada yang kurang jelas pada codenya dapat menanyakannya langsung pada kolom komentar atau mengunjungi facebook admin.

Selamat Mengerjakan ...

Apa itu HTML ?HTML (Hypertext Markup Language) adalah bahasa pemograman berbasis web, dimana seorang programmer w
Konfigurasi Codeigniter Php Framework 1 Sebelumnya kita sudah melakukan Instalasi Codeigniter Php Framework sekarang kita akan mela
ID HTMLKetika mendengar atau membaca sebuah kata ID tentunya yang kita tahu pertama adalah ID tersebut mer
List HTMLUmumnya untuk menampilkan suatu konten yang berisikan informasi berdasarkan data induk seseorang bi
Class HTMLPenggunaan CLASS pada HTML berperan sangat signifikan hal ini dikarenakan penggunaan ID yang hanya
Table HTMLPenggunaan TABLE didalam sebuah web sangat diperlukan misalnya saja seseorang ingin menampilkan kum
Dasar - Dasar HTML Untuk membuat sebuah website beberapa tools atau alat yang harus di install didalam sistem oper
Dasar - dasar PHP Setelah mengetahui pengertian dari bahasa pemrograman PHP, sekarang naik 1 tingkat dalam memaha
Konfigurasi Codeigniter Php Framework 2 Pada artikel Php Mysql - Konfigurasi Codeigniter Php Framework kita sudah melakukan konfigu
Create Basic Personal Data Website 1Setelah mengetahui dasar - dasar dalam proses penyusunan sebuah web dasar, sekarang mari kita imple

Take Knowledge

Selector CSS

Related Post

Popular

Label

Arsip