样式表/ CSS /链接错误

时间:2016-02-28 06:14:01

标签: html css stylesheet

尝试分配,并管理了初始步骤,但是当我在浏览器上进入index.html时,我会在框中看到奇怪的字符。

inspector view vs text editor view

然后我继续将CSS链接到.html文件中,它看起来与检查器视图图像中的完全一样。 (请参阅下面的css代码和带链接的HTML代码)

我尝试编辑文件,从浏览器中删除缓存,并看到了检查检查器并删除样式表的建议。但没有运气,我不知道该做什么。



body,
html {
  height: 100%;
  width: 100%;
  position: absolute;
  padding: 0;
  margin: 0;
  overflow: hidden;
  background-color: #0c93b0;
}
#profile_screen {
  position: absolute;
  height: 100%;
  width: 100;
}
#information_holder {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 200px;
  background-color: #666666;
}
#my_name {
  color: white;
  font-family: helvetica;
  text-align: center;
  font-weight: normal;
}
#date_of_birth {
  color: white;
  text-align: center;
  font-family: helvetica;
  font-size: 16px;
  font-weight: normal;
}
#current_age,
#current_weight {
  color: white;
  text-align: center;
  font-family: helvetica;
  font-size: 14px;
  font-weight: normal;
}
#main_navigation_holder {
  position: absolute;
  top: 200px;
  width: 100%;
  min-height: 200px;
}
.main_button {
  width: 50% height: 100% -webkit-appearance: none;
  background-color: transparent;
  outline: none;
  border: none;
  background-position: center center;
  background-size: 85px;
  background-repeat: no-repeat;
}
#settings_page_button {
  position: absolute;
  left: 0;
  background-image: url(‘../images/currentmedications@2x.png’);
}
#health_history_button {
  position: absolute;
  right: 0;
  background-image: url(‘../images/medicalhistory@2x.png’);
}
#add_item_screen {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: none;
}

<!doctype>

<html>


<head>
  <link rel="stylesheet" type="text/css" href="./index_files/index.css">
</head>


<body>

  <div id=“profile_screen” class=“screen”></div>
  <div id=“information_holder”>
    <h1 id=“my_name”> John Doe</h1>
    <h2 id=“date_of_birth”>02/28/2015</h2>
    <h3 id=“current_age”>01 yrs old </h3>
  </div>
  </div>

  <div id=“add_item_screen” class=“screen”></div>

  <div id=“list_of_history_screen” class=“screen”></div>

  <div id=“settings_screen” class=“screen”></div>

  <div id=“main_navigation_holder”>
    <input type=“button” id=“settings_page_button” value="Settings" />
    <input type=“button” id=“health_history_button” value="Health History" />
  </div>

</body>


</html>
&#13;
&#13;
&#13;

2 个答案:

答案 0 :(得分:0)

使用"代替和 将此代码放入head并重试?

<meta charset="UTF-8">

您的代码应该是这样的

&#13;
&#13;
<div id="profile_screen" class="screen"></div>
<div id="information_holder">
  <h1 id="my_name"> John Doe</h1>
  <h2 id="date_of_birth">02/28/2015</h2>
  <h3 id="current_age">01 yrs old </h3>
</div>

<div id="add_item_screen" class="screen"></div>

<div id="list_of_history_screen" class="screen"></div>

<div id="settings_screen" class="screen"></div>

<div id="main_navigation_holder">
  <input type="button" id="settings_page_button" value="Settings" />
  <input type="button" id="health_history_button" value="Health History" />
</div>
&#13;
&#13;
&#13;

答案 1 :(得分:0)

只需使用普通引号字符&#34; &#34;而不是你的html文件中的“”。

查看here