css code syntax

  1. div
  2. {   background-color:pink;     font-size:20px;   font-weight:bold;   }

the basic css syntax rules:-

  • a css rule consists of two main parts:  selector('div')  and  declaration('font-size:20px').
  • the declaration has two parts:property('font-size')   and value('20px').
  • each  style property-value pair must end with a semicolon(;).
  • the  selector is html element you want to style.
             
       <!doctype  html>
       
             <html>
             
             <head>
             
             <title>the demo apply css with html element </title>
             
             <style  type="text/css" >
             
             div  { background-color:#9f1919;font-size:30px;
             
             
                          color:yellow;border:2px dotted green;  }
             
             h2 {background-color:#3a5b9c;color:#ffffff;font-size:40px;
             
                          border:1px solid pink;  }
             
         </style>
         
          </head>
          
         <body>
         
             <div>
             
                <p>What you want you see the css result for div html element  </p>
             
                <p>you like this css. you can set css with html element. </p>
                
         </div>
         
             <h2> what is css (cascading styling sheet)  </h2>
             
             <h2> you  agree with  css style  </h2>
             
     </body>
     
   </html>

css comments - how use css comments inside css code

  • the comment in css style sheets are similar to those in c or c++ java language.
  • the comment is used to explain the css code
  • comment syntax:- em{color:red} /* red , really red is comment part */ 
  • comment cannot be nested.

   <html>

   <head>   

   <style   type="text/css"  >

   p {border:1px solid green;}

          correct css comment.               
/*style apply with html p element*/
/* border is property and its value 1px solid green*/

            incorrect css comment.               
        /* this is wrong comment   
        /* cannot be nested */    */

     </style>

     </head>

    </html>