usingcsscascadingstylesheets

Kebanyakan user lebih memilih menggunakan tema yang gratis, tapi terkadang tema yang dipilih ingin dirubah sedikit, baik itu tulisan, gambar dan warna background. CSS untuk tema yang digunakan ada pada template header(header.php) yang dinamai  style.css, Pada halaman admin, pilih editor dan klik style.css. Berikut beberapa CSS selector dan kegunaannya

CSS selector Deskripsi HTML CSS
body Mengatur secara keseluruhan situs blog, seperti warna dan tulisan <body> Body {back-ground-color:white}warna seluruh background adalah putih
p Menjelaskan format paragaf <p>This is aparagraph</p> p {color:black}warna tulisan paragraf adalah hitam
H1H2H3

H4

Menyediakan header untuk bagian yang berbeda situs <h1>This isa site title</h1> h1 {font-weight: bold;}font pada <h1>…</h1> pada HTML tags akan
a Mendefinisikan bagaimana teks Link ditampilkan pada
situs
<a href=”http://wiley.com”>Wiley

Publishing</a>

a {color: red}semua tekx link akan berwarna merah

 

Classes dan ID mendefenisikan bagian lain lain situs,

HTML CSS selector deskripsi
<div id=”page”> #page Tampilan elemen ID pada halaman situsPada bagian ini, CSS selectornya disebut page
<div id=”header”> #header Tampilan untuk elemen header template
<div id=”headerimg”> #header-img Tampilan untuk elemer gambar pada header template
<div class =”description”> .description Tampilan untuk elemen deskripsi class pada template

 

CSS properties dan value

CSS properties CSS value Contoh
back-ground-color Mendefenisikan warna background Markup: <div id=”page”>CSS: #page {background-color: white}
back-ground Mendefenisikan gambar background Markup: <div id=”headerimg”>CSS: #headerimg {background:url(images/header.jpg) no-repeat;}
font-family* Mendefenisikan font yang digunakan Markup: <body>CSS: body { font-family:‘Lucida Grande’, Verdana,

Arial, Sans-Serif;}

color Mendefenisikan warna teks Markup: <h1>Website Title</h1>CSS: h1 {color: blue}
font-size** Mendefenisikan ukuran teks Markup: <h1>Website Title</h1>CSS: h1 {font-size: 18px;}
text-align Mendefenisikan posisi teks Markup: <div id=”page”>CSS: #page {text-align:left;}