Monday, 24 September 2012

html & css

CSS:- CSS stands on Cascading Style Sheet. It's used for display the HTML content on web page. Style sheet file extension is .css.

We can add style sheet in html file by using the '<link />' tag. For example.
<link rel="stylesheet" href="http://myresarch.blogspot.com/mystyle.css" type="text/css"/>

And we can add open css in html file by using the '<style />' tag. For example:-
<style type="text/css">
   body {
        background-color:#d0b4fb;
   }
   h1 {
      color:green;
      font-family:"Times New Roman";
      font-size:20px;
  }
</style>


Some example of css is:-

1. Full Screen overlay:-
       .blackOverlay{
            height:100%;
            width:100%;
            position:fixed;
            left:0;
            top:0;
            z-index:9999 !important;
            background-color:black;
       }

2. Rotate Text using css:-

-webkit-transform: rotate(269deg);
-moz-transform: rotate(269deg);
-o-transform: rotate(269deg);
writing-mode: rl-tb;

.rotate {
     -moz-transform: rotate(-90.0deg);  /* FF3.5+ */
       -o-transform: rotate(-90.0deg);  /* Opera 10.5 */
  -webkit-transform: rotate(-90.0deg);  /* Saf3.1+, Chrome */
             filter:  progid:DXImageTransform.Microsoft.BasicImage(rotation=0.083);  /* IE6,IE7 */
         -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=0.083)"; /* IE8 */
}


$(document).ready(function () {
    $('.rotate').css('height', $('.rotate').width());
});

-webkit-transform: rotate(269deg);