Css根本不适用

时间:2017-10-06 23:19:41

标签: html css

说明
我有一个用纯HTML编写的页面和一个CSS文件,它在所有我的其他页面上工作正常,除了一个
CSS文件保存在/ styles中.css和/site.html中的HTML页面。
我还检查了错误中的CSS和html文件,没有。

问题:
我希望CSS能够在/site.html上运行。



@font-face {
  font-family: Webfont;
  src: url(/fonts/webfont-normal.ttf);
}

@font-face {
  font-family: Webfont;
  src: url(/fonts/webfont-bold.ttf);
  font-weight: bold;
}

body {
  font-family: Webfont, monospace;
  background-color: #f0f8ff;
  margin: 0;
}

body div.center {
  max-height: 100vh;
  margin: auto;
  width: 80%;
}

.header {
  font-family: Webfont, monospace;
  font-size: 30px;
  width: 30%;
  margin: auto;
  padding-top: 30%;
}

.header {
  margin: 0;
}

body div.button {
  color: #000;
}

.text-large {
  font-size: 20px;
  font-weight: bold;
}

.subtitle {
  font-size: 18px;
}

div.subtitled {
  font-size: 18px;
  font-weight: bold;
}

ul li {
  list-style: none;
  margin-bottom: 15px;
}

ul li img {
  display: block;
}

ul li span {
  display: block;
}

a {
  transition: 1s;
  padding: 1px;
  margin: 5px;
  color: lightslategray;
  max-width: 200px;
}

a:hover {
  transition: 1s;
  color: black;
}

input {
  border: 1px solid aliceblue;
  border-radius: 20px;
  width: 200px;
  height: 30px;
  cursor: pointer;
  font-family: Webfont;
  font-size: 15px;
}

input[type=text] {
  border: none;
  border-radius: 0px;
  cursor: text;
  font-family: Webfont;
  font-size: 15px;
}

.logo {
  position: absolute;
  width: 300px;
  height: 300px;
}

.but {
  border: 2px solid darkseagreen;
  border-radius: 20px;
  padding: 8px;
  margin: 5px;
  font-family: Webfont;
  font-size: 15px;
}

.inside {
  height: 70%;
  padding: 20px;
  margin: 10px;
}

.login-view .background {
  width: 100vw;
  height: 100vh;
  position: fixed;
  top: 0;
  left: 0;
  background-color: rgba(0, 0, 0, 0.7);
  z-index: 5;
}

.login-view .login {
  width: 50vw;
  height: 60vh;
  background-color: aliceblue;
  position: absolute;
  top: 20vh;
  left: 25vw;
  overflow-y: scroll;
  overflow-x: hidden;
}

.login-view .container {
  margin-top: 100px;
}

.login-view .header {
  padding: 0;
  width: 65px;
  margin: auto;
}

.login-view form {
  width: 200px;
  margin: auto;
}

.login-view p {
  width: 143px;
  margin: auto;
}

.closed {
  display: none;
}

.open {
  display: block;
}

button#login {
  transition: 1s;
  background-color: aliceblue;
  border: none;
  font-family: Webfont;
  font-size: 16px;
  color: lightslategray;
  text-decoration: underline;
  cursor: pointer;
}

button#login:hover {
  transition: 1s;
  color: black;
}

img.deck {
  width: 5vw;
}

img.poker {
  width: 5vw;
}

canvas {
  margin-top: 20px;
}

object {
  margin-left: 35vw;
}

.opendiv {
  transition: 1s;
  border: 2px solid black;
  height: 200px;
}

.closediv {
  transition: 1s;
  height: 0px;
  border: none
}

.opener {
  border-radius: 10px;
  background-color: #E7F4FF;
  overflow-x: hidden;
  overflow-y: scroll;
}

.opener::-webkit-scrollbar {
  display: none;
}

@media screen and (max-width: 800px) {
  .login-view .login {
    width: 100vw;
    left: 0;
  }
  img.deck {
    width: 20%;
    display: inline-block;
  }
  div.deck {
    width: 100%;
    margin: 0;
  }
  img.poker {
    width: 20vw;
  }
  object {
    margin: 0;
  }
}

<div class="center">
  <p class="header">Sitemap</p>
</div>
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:3)

您的链接标记上有拼写错误,应该是:

<link rel="stylesheet" href="/styles.css">