个人中心
gpt4 book ai didi

javascript - Visual Studio 2015 没有完全加载我的样式表

转载 作者：行者123 更新时间：2023-11-28 06:16:47 25 4
gpt4 key购买 nike

Visual Studio 2015 没有完全加载我的样式表，因此在我测试它时缺少一些元素。我不确定如何解决这个问题。我是 Visual Studio 的新手，所以我不确定问题出在哪里。我已经包含了我的 html 和 css 文件。谢谢

我的 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:titusjackson@mac.com"><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:titusjackson@mac.com">
                <p>titusjackson@mac.com</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;
}

最佳答案

所以样式表出现了，只是样式表中引用的图像没有显示？当我遇到这个问题时，要么是文件路径不正确，要么是内容文件实际上并未添加到元素中。如果您右键单击图像文件夹并为所有图像单击“添加 > 现有元素”，有时可以解决问题(至少对我而言)。

关于javascript - Visual Studio 2015 没有完全加载我的样式表，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/35848209/

25 4 0
文章推荐： html - 绝对定位的 div 中的文本重叠
文章推荐： c# - EMGU CV 图像人脸识别
文章推荐： c++ - WINAPI 光标在应用程序窗口上的单击位置
文章推荐： html - 在导航栏内定位 div
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com