0
的Visual Studio 2015年所以有，當我測試它缺少一些元素沒有被完全加載我的樣式表。我不知道如何解決這個問題。我是Visual Studio的新手，所以我不確定問題出在哪裏。我已經包含了我的html & css文件。謝謝的Visual Studio 2015年沒有完全加載我的樣式表
我的HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Your ASP.NET application</title>
<link href="StyleSheet.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="home">
<div id="header">
<nav>
<ul>
<li><a href="#home">Home</a></li>
<li><a href="#about">About</a></li>
<li><a href="#projects">Projects</a></li>
<li><a href="#contact">Contact</a></li>
</ul>
<div id="styledimg"></div>
</nav>
</div>
</div>
<div id="head-soc">
<div id="linkedin-icon"><a href="http://linkedin.com/pub/titus-jackson/2/a2b/939">Linkedin</a></div>
<div id="youtube-icon"><a href="http://youtube.com/titusishmael">Youtube</a></div>
<div id="facebook-icon"><a href="http://facebook.com/titusjackson1">Facebook</a></div>
</div>
<div class="content"><p>Create, Collaborate, Innovate</p></div>
<div class="fadein">
<img src="images/pic1.png" alt="" style="width: 90%; height: 825" class="active" />
<img src="images/pic2.png" alt="" style="width: 90%; height: 825;" />
<img src="images/pic3.png" alt="" style="width: 90%; height: 825;" />
<img src="images/pic4.png" alt="" style="width: 90%; height: 825;" />
</div>
</div>
<div id="about">
<div class="wrapper">
<h4>Titus Jackson</h4>
<p>Film Maker ~ Screen Writer ~ Editor</p>
</div>
<img src="Images/Titus-Jackson1.jpg" alt="Titus Jackson" width="425" height="365" border="0" />
<div id="section2">
<p>
For over 15 years <span>Cinemuze</span> has had the honor of working with some of the most talented creative collaborators Tulsa has to offer. We love working
on a variety of projects. As it is our goal to be a well rounded company with our fingers in a lot of pies.
</p>
<p>
Our paramount value is to approuch the material with excellence and an orignal point of view to tell a unique and compelling story. It is our belief that
life is what you make of it, and the saddest lost is not to explore all your potential in the short time you've been given.
</p>
<p>
We've had the opportunity to work on multiple feature films and national television shows ranging from christian television to TLC television. We've created
mulitple award winning music videos, short films and evevn a feature film. Feel free to take a look around the site, drop us an email, we look forward to hearing
from you.
</p>
<a href="mailto:[email protected]"><img src="images/email1.png" alt="email1" width="26" height="26" /></a>
</div>
</div>
<div id="projects">
<h5>View our current projects</h5>
<ul>
<li>
<iframe width="265" height="200" src="https://www.youtube.com/embed/8CZJzUk7fFM" frameborder="0" allowfullscreen></iframe>
<p>Eugene Gregory Promo</p>
</li>
<li>
<iframe width="265" height="200" src="https://www.youtube.com/embed/cLm3Vh4_Ruc" frameborder="0" allowfullscreen></iframe>
<p>Family Cup Promo</p>
</li>
<li>
<iframe width="265" height="200" src="https://www.youtube.com/embed/2t9-vVNgF7c" frameborder="0" allowfullscreen></iframe>
<p>This Generation</p>
</li>
</ul>
</div>
<div id="contact">
<section3>
<h3>To connect with us:</h3>
<p><span>Cinemuze</span> is based in Tulsa, Oklahoma and travels widely for a variety of projects.</p>
<p>If your interested in our work, you can connect with us via email or phone.</p>
</section3>
<div class="section4">
<img src="images/email1.png" alt="email" width="26" height="26" />
<a href="mailto:[email protected]">
<p>[email protected]</p>
</a>
<img src="images/phone.png" alt="phone" width="24" height="24" />
<p>+1 (918) 671-3340</p>
</div>
</div>
<footer>
</footer>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<script type="text/javascript">
$(function() {
$('.fadein img:gt(0)').hide();
setInterval(function() {
$('.fadein :first-child').fadeOut(2000)
.next('img').fadeIn(2000)
.end().appendTo('.fadein');},
3000);
});
</script>
</body>
</html>
我的CSS
@charset "UTF-8";
/* CSS Document */
body {
font: 100%/1.4 Verdana, Arial, Helvetica, sans-serif;
background-color: #42413C;
margin: 0;
padding: 0;
color: #000;
}
#header {
width: 100%;
margin-top: -15px;
position: fixed;
background-color: rgba(60,59,59,1.00);
transition-duration: 1s;
z-index: 25;
}
div#header nav {
width: 1425;
height: 110px;
}
div#header ul {
list-style: none;
margin-left: 100px;
float: left;
}
div#header li {
float: left;
margin-left: 64px;
margin-top: 10px;
}
div#header a {
color: white;
text-decoration: none;
line-height: 45px;
font-size: .9em;
text-transform: capitalize;
}
div#header a:hover {
color: rgba(249,0,3,1.00);
}
div#styledimg {
background-image: url(images/logo.png);
background-repeat: no-repeat; width: 224px;
height: 85px;
float: right;
margin-right: 150px;
margin-top: 10px;
}
/*page-specific header styles*/
#header {
background-color: rgba(60,59,59,1.00);
width: 1425;
height: 110px;
}
/* layout styles*/
/*home page*/
div#home {
height: 950px;
background-color: transparent;
}
.fadein {
position: relative;
width: 100%;
height: 825px;
}
.fadein img {
border: 80px solid rgba(60,59,59,1.00);
height: 825;
position: absolute;
left: -225px;
top: -35px;
z-index: -9;
}
#header {
background-color: rgba(60,59,59,1.00);
}
#head-soc {
width: 129;
height: 86;
margin: 10px;
padding: 0px;
float: right;
margin-right: 40px;
margin-top: 300px;
right: 25px;
position: fixed;
z-index: 25;
}
#head-soc a {
margin-top: 10px;
margin-right: 20px;
}
#linkedin-icon a {
text-indent: -9999px;
font-size: 0;
line-height: 0;
overflow: hidden;
height: 43px;
width: 43px;
border: 0;
background-image: url(Images/socialsprites_white.png);
display: block;
float: right;
background-position: 0px 0px;
}
#linkedin-icon a:hover {
background-image: url(Images/socialsprites_white.png);
background-position: 0px -43px;
}
#youtube-icon a {
text-indent: -9999px;
font-size: 0;
line-height: 0;
overflow: hidden;
height: 43px;
width: 43px;
border: 0;
background-image: url(Images/socialsprites_white.png);
display: block;
float: right;
margin-left: 20px;
background-position: -43px 0px;
}
#youtube-icon a:hover {
background-image: url(Images/socialsprites_white.png);
background-position: -43px -43px;
}
#facebook-icon a {
text-indent: -9999px;
font-size: 0;
line-height: 0;
overflow: hidden;
height: 43px;
width: 43px;
border: 0;
background-image: url(Images/socialsprites_white.png);
display: block;
float: right;
background-position: -86px -85px;
}
#facebook-icon a:hover {
background-image: url(Images/socialsprites_white.png);
background-position: -86px -128px;
}
.content p {
font-family: BlairMdITC TT-Medium;
font-size: 44px;
width: 550px;
left: 50%;
margin-left: -15%;
margin-top: 25%;
color: rgba(249,0,3,1.00);
position: absolute;
}
/* about page*/
div#about {
background-color:rgba(188,184,184,1.00);
height: 550px;
margin-top: -5px;
padding-top: 100px;
z-index: 35;
}
.wrapper h4 {
font-famiy: Geneva;
font-size: 25px;
padding-left: 224px;
color: rgba(249,0,3,1.00);
margin-bottom: -20px;
}
.wrapper p {
font-family: Geneva;
font-size: 12px;
margin-left: 226px;
margin-top: 20px;
margin-bottom: 15px;
color: rgba(134,133,133,1.00);
}
h6 {
padding-left: 225px;
margin-top: -20px;
margin-bottom: 10px;
color: rgba(60,59,59,1.00);
}
img {
float: left;
margin-left: 225px;
margin-right: 15px;
}
#section2 {
font-family: Helvetica;
font-size: 16px;
color: rgba(60,59,59,1.00);
width: 1280px;
padding-top: -80px;
height: 300px;
}
#section2 p {
color: rgba(60,59,59,1.00);
}
#section2 img {
margin-left: 2px;
}
span {
color: rgba(249,0,3,1.00);
}
/* projects page */
div#projects {
background-color: #3A3939;
background-position: 25px;
height: 450px;
margin: 0px;
line-height: 0;
padding-top: 25px;
}
div#projects ul {
list-style: none;
margin-left: 100px;
float: left;
}
div#projects li {
float: left;
margin-top: 65px;
margin-left: 120px;
}
div#projects li p {
margin-left: 20px;
text-align: center;
font-family: BlairMdITC TT-Medium;
font-size: 20px;
color: rgba(249,0,3,1.00)
}
@media only screen and (max-width: 632px) {
div#projects li {
float: none;
margin-top: 65px;
margin-left: 95px;
}
div#projects li p {
margin-left: 10px;
text-align: center;
}
}
div#projects h5 {
margin-left: 650px;
font-size: 20px;
font-family: Helvetica, Arial, sans-serif;
color:rgba(179,178,178,1.00);
padding-bottom: 45px;
margin-bottom: -15px;
}
p {
font-size: 16px;
margin-left: 195px;
color: rgba(249,247,247,1.00);
}
/* contact page */
div#contact {
background-image:url(images/studio4.png);
background-size: cover;
background-attachment: fixed;
padding-top: 35px;
padding-bottom: 100px;
}
section3 h3 {
font-family: Arial, Helvetica, sans-serif;
font-size: 22px;
color: rgba(249,0,3,1.00);
margin-left: 660px;
margin-top: 75px;
}
section3 p {
font-family: Arial, Helvetica, sans-serif;
font-size: 18px;
color: rgba(255,255,255,1.00);
width: 650px;
padding-left: 85px;
margin-left: 385px;
}
.section4 {
font-family: Helvetica, sans-serif;
font-size: 16px;
color: rgba(255,255,255,1.00);
margin-left: 440px;
margin-top: 50px;
}
.section4 a {
text-decoration: none;
}
.section4 a p:hover {
color: rgba(249,0,3,1.00);
}
/* ~~ The footer ~~ */
/*HTML 5 support - Sets new HTML 5 tags to display:block so browsers know how to render the tags properly. */
header, section, footer, aside, article, figure {
display: block;
}
檢查，如果stylesheetfile包括在 – silviagreen