CSS.

Presentasi berjudul: "CSS."— Transcript presentasi:

1 CSS

2 p { background-color : red ; border : 1px solid gray ; } Pilih elemen yang akan diberi style Tentukan propertinya Apa style nya

3 font-family color border-bottom

4 h1 ,h2 { font-family : sans-serif ; color : gray ; } h1{ border-bottom : solid 1px black ;

5 Gambar diagram elemen HTML

6 Untuk memasukkan elemen kedalam suatu class , <p class=“greentea”>
p.greentea{ color : green ; } blockquote.greentea, p.greentea{

7 Font & color font-family (sans-serif, serif, monospace, cursive, fantasy) body { font-family : verdana, geneva, arial, sans-serif; } font-size font-size : 14px ; atau font-size : 150%; atau font-size : 1.2em; atau font-size : small ; Text-decoration text-decoration : underline ;

8 font-weight font-weight :bold ; (normal, bolder, lighter) font-style font-style : italic; line-height line-height : 1.6 em ; color memakai nama warna hanya ada 17 cara lain memakai rgb  color : rgb (80%,20%,0%) ; kode hex color : # cc6060 ;

9 Box models padding : 25 px; margin : 30 px

10 background-image : url(xxx/xxx); background-repeat : no-repeat (repeat-x, repeat-y, inherit); background-position : top left; border-style : solid (groove, double, dashed, dotted, inset, outset, ridges); border-width : thin (medium, thick, 5px); border-color

11 Attribute id Hampir sama dengan class
Elemen tidak bisa memiliki lebih dari satu id #footer{ color : red ; } p#footer{ color: red ;

12 Div Dengan membungkus elemen-elemen dalam suatu <div> => elemen-elemen tersebut berada dalam satu grup Beri label => <div id=“kucing”> #kucing{ border-width : thin ; border-style : solid ; border-color : #007e7e ; width : 200 px ; }

13

14

15 div h2 { color : black; } Lebih spesifik lagi #elixir h2 { color : black ;

16 span Grouping didalam inline character dan element

17 Di html  <span class =“cd”></span> Di css
font-style : italic ; }