8
What will you learn today? Id Class Box model

CSS Class and Id

  • Upload
    jovy75

  • View
    239

  • Download
    1

Embed Size (px)

Citation preview

Page 1: CSS Class and Id

What will you learn today?

IdClassBox model

Page 2: CSS Class and Id

CSSclass

Classes are useful to apply similar declarations to a variety of elements.

Class is specified by including a period (.) before the selector name.

Page 3: CSS Class and Id

CSSclass.className{ property: value}

SYNTAX:

.myStyle{ color: #99FF00}

<p class=“myStyle”> Some text here</p>

<h3 class=“myStyle:>Heading 3</h3>

Page 4: CSS Class and Id

CSSid

Id selector can be called only once in a document.

Id is specified by including a number sign(#) before the selector name.

Id can be called by Javascript’s getElementById function.

Page 5: CSS Class and Id

CSSid

.#idName{ property: value}

SYNTAX:

.box1{ background-color:#CCDDFF}

<div id =“box1”> Some text here</div

Page 6: CSS Class and Id

CSSBox MODELThe CSS box model is

essentially a box that wraps around HTML elements, and it consists of: margins, borders, padding, and the actual content.

Page 7: CSS Class and Id

Thank

YOU!!!