我无法使用谷歌字体或背景标题图像

时间:2018-04-09 11:16:46

标签: html css

我意识到这一点很长,但我不知道我的问题在哪里,因为没有任何表现正确。我试图获取Google字体以及标题背景图片。我把html分开了。

@import url('https://fonts.googleapis.com/css?family=Julius+Sans+Onexxx ');
body {
    font-family: 'Julius+Sans+One', sans-serif;
    font-size: 20px;
  }

/*****GENERAL*****/
* {margin: 0; padding: 0;}
header, main, nav, footer, video {display: block;}
body {font-size:100% line-height:1.5px; font-family: sans-serif;}

/*****WRAPPER*****/
 #wrapper{width: 1024px; margin: 0 auto;}

/*****HEADER*****/
 #header h1 {height: 50px; background-image: url(../images/mountain- 
 shed.jpg); padding-top: 200px; padding-right: 0px; padding-bottom: 0px; 
 padding-left: 20px; font-family: 'Julius-sans-serif'; color: #FFF}

 /*****NAVIGATION*****/
  #nav nav {border-width: 1px; border-color: black; border-style: solid;
 }

 /*****MAIN*****/
 /*main {border: 1px solid #000; border-top: none; padding: 10px;}*/
  #images img{height: 90px; width: 120px; margin: 20px;}

1 个答案:

答案 0 :(得分:0)

为了便于阅读,我使用了CSS美化。

你的导入最后只有3 x。还有一个空间(不确定是否重要)。 但这是你的CSS,应该可以正常工作。

@import url('https://fonts.googleapis.com/css?family=Julius+Sans+One');
body {
    font-family: 'Julius Sans One', sans-serif;
    font-size: 20px;
}

* {
    margin: 0;
    padding: 0;
}

header,
main,
nav,
footer,
video {
    display: block;
}

body {
    font-size: 100% line-height:1.5px;
    font-family: sans-serif;
}


#wrapper {
    width: 1024px;
    margin: 0 auto;
}


#header h1 {
    height: 50px;
    background-image: url(../images/mountain-shed.jpg);
    padding-top: 200px;
    padding-right: 0px;
    padding-bottom: 0px;
    padding-left: 20px;
    font-family: 'Julius-sans-serif';
    color: #FFF
}


#nav nav {
    border-width: 1px;
    border-color: black;
    border-style: solid;
}

#images img {
    height: 90px;
    width: 120px;
    margin: 20px;
}