Better Css Writen Techniques

  • If you can write css better than first select editor.
    The best editor is Dreamweaver and net beans.
    You can find the better than it.
    I just tell you because it is provide old declared class name so, you can easily give different name.
  • Let’s start, first given the comment of any css file and provide information of css file like (name, version etc).
    Each apply css on html elements than create group of element and give the comment of that like following header element comment is:

         /* Header Element */

  • If you have any kind of css file can import then import the file.
    Finally, put the code but first class name and id name define curly bracket “ { } ” can start at that line just like follow:

         .Demo #Work {
              Margin: 0px;
         }

  • If you can apply same code more than one or two classes and id or tags than after separate put in the next line like follow:

         .Demo #work,
         .Test > p {
             Margin: 0px;
         }

  • Whenever you can put four pixel( four pixel means top, left, bottom, right ) or any value If top and bottom value is same and left and right value is same than give as follow:

         <attribute name>:0px 0px;


    First pixel indicates top and bottom values
    Second pixel indicates left and right values
  • If you can apply same value of four pixel than given as follow:

         <attribute name>:0px;
    Css can given the separate code like under
         <attribute name>
         <attribute name>-right:0px;
         <attribute name>-left:0px;
         <attribute name>-bottm:0px;

    It is only use when give separately attributes otherwise not given
  • If you can apply more than 5-6 of each tag than attribute write a group and each group separate with one line space. Like follow :

          .Demo {
              Margin: 0px;
              Padding: 0px;
              Width: 0px;
              Height: 0px;

              Background-color: #000;
              Color: #fff;

              Cursor: pointer;
              Z-index: 300;
          }

  • And two tag attribute you can also give one line space to separate it. Like

          .Demo {
              Margin: 0px;
          }

          .work {
              Margin:20px;
          }

Comments

Popular posts from this blog

How to create a custom form in wordpress

My new Jquery Plugin name is krDailog