Question

问题1.字体不会改变
问题2.关于“id”的高度不会改变

问题一，字体代码有什么不合适的地方吗？

<head>
   <title>Jubilee Austin Developer</title>
<link rel="stylesheet" href="css/main.css">
<link href='https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700' rel='stylesheet' type='text/css'>
</head>

问题二，例如。这是我所拥有的3个“id”之一。它没有响应CSS或至少它没有实际显示高度变化

<section id="about">
       <div class="full-width">
         <h2>A little bit about me</h2>
         <div class="half-width">
           <p> i've made my home base in Providence, Rhode Island with my small growing family. My journey into tech started with a degree in journalism.As I started sharing my writing online, I was fascinated with how easily I could get my voice out there. I was hooked and wanted to learn how to build my own site to fit my own specific needs.</p>
         </div>
           <div class="half-width">
             <p>That curiosity then opened a door that could never be shut. When I learned how to build my first website, I realized I found something that gave me the freedom &amp; versatility I was looking for in my work. Now i've made a full switch to front-end development, where I can use my organization skills and eye for detail to write clean, elegant code.</p>
           </div>
           </div>
     </section>

我的整个CSS

/****Base syles***/
body {
  font-family: 'Source Sans Pro', sans-serif;
}
#about, #work, #contact {
    height: 600px;
}

整个代码，以防您需要任何内容

http://i.stack.imgur.com/Q73h1.png

如果我遗漏了您需要的任何内容，请随时提出

Answer 1

只需颠倒您调用样式的顺序：

<link href='https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700' rel='stylesheet' type='text/css'>
<link href="css/main.css" rel="stylesheet" type='text/css'>

Answer 2

关于高度部分：如果内容不如父元素高，并且没有背景或边框，则不会看到高度。添加类似border: 1px solid red;的内容，以查看元素的完整高度。

#about, #work, #contact {
  height: 600px;
  border: 1px solid red;
}

字体不会改变，ID高度不会显示

2 个答案: