我一直在尝试将字体更改为CircularPro Bold,但是当我加载页面时它不会渲染,而是默认为Times New Roman。可以使用一些帮助来弄清楚它为什么不渲染
我在静态目标网页上使用了一种布局。
谢谢
Layout.erb看起来像这样
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<title>Info</title>
<!-- Bootstrap Core CSS -->
<link href="css/bootstrap.min.css" rel="stylesheet">
<!-- Custom CSS -->
<link href='https://fonts.googleapis.com/css?family=PT+Sans+Narrow:700' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="http://lineto.com/The+Fonts/Font+Categories/Text+Fonts/Circular/Bold/" rel='stylesheet' type='text/css'>
<!-- Custom Fonts -->
<link href="font-awesome/css/font-awesome.css" rel="stylesheet" type="text/css">
<link href="css/modern-business.css" rel="stylesheet">
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
Modern-Business.css看起来像这样
@font-face {
font-family:"CircularPro Bold";
src:url(fonts/lineto-circular-pro-bold.eot?#iefix) format(embedded-opentype),
url(fonts/lineto-circular-pro-bold.woff) format(woff),
url(fonts/lineto-circular-pro-bold.ttf) format(truetype),
url(fonts/lineto-circular-pro-bold.svg#CircularProBold) format(svg);
font-weight:400;
font-style:normal;
font-size: 4em;
}
h2{
font-family: 'CircularPro Bold';
}