Are you first timer at Why not join us and start exchange your programming knowledge with everyone. Register today!

CSS - font properties & font type

0 votes
added Jul 18, 2018 in CSS by LC Marshal Captain (20,510 points)
/*use font awesome content on :before pseudo*/
  &:before {
   font-family: FontAwesome;
   content: "\f067";
   margin-right: 5px;
/*Add font properties in a single line*/
font: 300 16px/1.4 'Trade Gothic';
/*using eot, ttf, woff font*/ 
@font-face {
  font-family: 'Trade Gothic';
  src: url('../fonts/trade-gothic-no-18-condensed.eot');
  src: url('../fonts/trade-gothic-no-18-condensed.eot?#iefix') format('embedded-opentype'), url('../fonts/trade-gothic-no-18-condensed.woff') format('woff'), url('../fonts/trade-gothic-no-18-condensed.ttf') format('truetype'), url('../fonts/trade-gothic-no-18-condensed.svg#font-name') format('svg');
  font-weight: normal;
  font-style: normal;
@font-face {
  font-family: 'Trade Gothic';
  src: url('../fonts/trade-gothic-no-20-condensed-bold.eot');
  src: url('../fonts/trade-gothic-no-20-condensed-bold.eot?#iefix') format('embedded-opentype'), url('../fonts/trade-gothic-no-20-condensed-bold.woff') format('woff'), url('../fonts/trade-gothic-no-20-condensed-bold.ttf') format('truetype'), url('../fonts/trade-gothic-no-20-condensed-bold#font-name') format('svg');
  font-weight: bold;
  font-style: italic; 
/*Add multiple google font's variant*/
<link href=",700" rel="stylesheet">


Please log in or register to response this reference. - Malaysia's programming knowledge sharing platform, where everyone can share their finding as reference to others.