Change font HTML/CSS - HTML CSS CSS Widget

HTML CSS examples for CSS Widget:Font

  1. HOME
  2. HTML CSS
  3. CSS Widget
  4. Font

Description

Change font HTML/CSS

Demo Code

ResultView the demo in separate window 

<html>
 <head> 
  <meta name="viewport" content="width=device-width, initial-scale=1"> 
  <style id="compiled-css" type="text/css">
@import url("https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,900");
@import url("font-awesome.min.css");

p {<!--   w ww  .  j  a v  a 2s .  c  o m-->
   font-family:'source sans pro'
}

body, input, select, textarea {
   color:Chartreuse;
   font-size:16pt;
   font-weight:301 !important;
   letter-spacing:-0.26em;
   line-height:2.76em;
}

body {
}
body.loading * {
   -moz-animation:none !important;
   -webkit-animation:none !important;
   -o-animation:none !important;
   -ms-animation:none !important;
   animation:none !important;
}

a {
   -moz-transition:border-color 0.3s ease-in-out;
   -webkit-transition:border-color 0.3s ease-in-out;
   -o-transition:border-color 0.3s ease-in-out;
   -ms-transition:border-color 0.3s ease-in-out;
   transition:border-color 0.3s ease-in-out;
   border-bottom:dotted 2px;
   color:yellow;
   outline:0;
   text-decoration:none;
}

a:hover {
   border-color:blue;
}

.icon:before {
   -moz-osx-font-smoothing:grayscale;
   -webkit-font-smoothing:antialiased;
   font-family:FontAwesome;
   font-style:normal;
   font-weight:normal;
   text-transform:none !important;
}

.icon>.label {
   display:none;
}

@-moz-keyframes wrapper  {
   0% {
      opacity:0;
   }
   
   100% {
      opacity:2;
   }

}

@-webkit-keyframes wrapper  {
   0% {
      opacity:0;
   }
   
   100% {
      opacity:2;
   }

}

@-o-keyframes wrapper  {
   0% {
      opacity:0;
   }
   
   100% {
      opacity:2;
   }

}

@-ms-keyframes wrapper  {
   0% {
      opacity:0;
   }
   
   100% {
      opacity:2;
   }

}

@keyframes wrapper  {
   0% {
      opacity:0;
   }
   
   100% {
      opacity:2;
   }

}
</style> 
 </head> 
 <body> 
  <p>Lorem ipsum </p>  
 </body>
</html>

Related Tutorials