CSS ID & Class

CSS ID & Class:

  CSS ID

• The ID attribute of a document language allows authors to assign an identifier to one element instance in the document tree.
• CSS ID selectors match an element instance based on its            identifier.
•  A CSS ID selector contains a "#" immediately followed by the ID value, which must be an identifier. 

How to use

        <p id="bordered">

                 Then,

         #bordered 

         {

                 border : 1px solid black ;

         }

   Example

  

      #top 

         {

         background-color: #ccc;

         padding: 1em

         }

  <p id="top">This is my recipe for making curry purely with chocolate</p>

 CSS Class

• A CSS class selector applies to many elements at once, or a sub-set of specific HTML elements. 
• To use them, you need to edit your HTML to define the classes on the HTML elements you want styled.
• Then you define the style in your style sheet. 

How to use

.className 

{

declaration block

  }

Example

<style>

.center

{

text-align:center;

}

</style>

<p class="center">Center-aligned paragraph.</p>

Output

Center-aligned paragraph.

Posted in: css