Simple Syntax Highlighter

Scripts for Syntax Highlighters are found in large number on the Internet. In this article let me show you, how to create a simple CSS Syntax highlighter.

1. .syntax{
   background-color:black;
   color:white;
   border-style:outset;
   border-width:3px;
   border-color:black;
   opacity:0.75;
   -moz-border-radius:10px;
   -goog-ms-border-radius:10px;
   -ms-border-radius:10px;
   -o-border-radius:10px;
   border-radius:10px;
   padding:10px;
   background-size:100% 150%;
   background-repeat:no-repeat;
   }
2. The above code generates you a simple Syntax Highlighter.
   • background-color  :is a CSS property that gives the background a mentioned color.
   • color :
     is a CSS property that gives the text inside the <div> a mentioned color.
   • border properties are explained here : http://css.krishnainfotron.com/2012/05/border-styles.html
   • browser specific definitions are also explained :  http://css.krishnainfotron.com/2012/04/browser-specific-definitions-css.html
     padding is explained here : http://css.krishnainfotron.com/2012/12/padding.html
3. You can know how to use this CSS in your blogger blog here : http://css.krishnainfotron.com/2012/04/how-to-define-css-in-blogger-blog.html and in general html here : http://css.krishnainfotron.com/2012/04/how-to-define-css-in-general-html.html