我刚开始使用Foundation 6。 我正在使用带有css文件和js文件的简单存档。
我试图用我的覆盖默认字体系列,但基础css样式覆盖我的CSS。我做错了什么?
这是我的代码:
@font-face {
font-family: josefin;
src: url('../fonts/josefin/JosefinSans-Regular.ttf');
}
body{
font-family: 'josefin';
}
.main-header{
background-color: #D72B3F;
}
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="lib/foundation-6/css/foundation.css">
<link rel="stylesheet" href="css/app.css">
</head>
<body>
<header>
<div class='main-header expanded row'>
<div class='small-12 columns'>
<h1>Title</h1>
</div>
</div>
</header>
<footer>
<div class='row'>
<div class='small-12 colums'>
<h1>Footer</h1>
</div>
</div>
</footer>
<script type="text/javascript" src="lib/jquery/jquery-1.12.0.min.js"></script>
<script type="text/javascript" src="lib/foundation-6/js/foundation.min.js"></script>
</body>
</html>
感谢。
Edit1:我试过了!重要而且它不起作用。
Edit2:我不认为这是关于我的css语法本身是错误的,因为当我在firebug中停用foundation.css的字体条目时,我可以在我的自定义css中显示字体定义。
答案 0 :(得分:0)
我解决了我的问题,我觉得很愚蠢:)
我正在测试我的balise上的字体,而foundation.css对元素有一个特定的规则。
所以我必须在css中覆盖。
h1,h2,h3,h4,h5,h6{font-family: 'josefin';}
我们走了,谢谢你的帮助!