文档建议反馈控制台
首页
学习
活动
专区
圈层
工具
MCP广场
文章/答案/技术大牛
发布
社区首页 >问答首页 >徽标上传在支架中工作，但不能通过CyberDuck实时上载

问徽标上传在支架中工作，但不能通过CyberDuck实时上载
EN

Stack Overflow用户
提问于 2017-08-21 19:13:08
回答 2查看 98关注 0票数 0

我已经为一个朋友设计了一个网页，但是当我尝试更改H2图片的png标识时。它似乎不想加载。

然而，奇怪的是，.PNG文件在支架应用程序中工作。而不是在服务器上运行。

网页在这里：http://www.donjaswell-beingforkids.co.uk/

它应该看起来像这样：(括号预览)

​

​

这段代码来自Index.HTML代码，我将在下面编写：

代码语言：javascript
复制
    <!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Home | Donja's Well-Being For Kids</title>
    <link rel="stylesheet" href="css/normalize.css">
    <link href="https://fonts.googleapis.com/css?family=Gloria+Hallelujah|Indie+Flower|Shadows+Into+Light|Shadows+Into+Light+Two" rel="stylesheet">
    <link rel="stylesheet" href="css/main.css">
    <link rel="stylesheet" href="css/responsive.css">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="favicon" type="image/png" href="img/Kids-Well-Being.png">
  </head>
  <body>
    <header>
      <a href="index.html">
        <img id="logo" src="img/Donjas-Well-Being-For-Kids.png" alt="Donja's-Well-Being-For-Kids">
        <!--
        <h2 id="logo" class="centerText">Donja's Well-Being For Kids</h2>
        -->
      </a>
      <nav>
        <ul>
          <li><a href="index.html" class="selected">Home</a></li>
          <li><a href="about.html">About</a></li>
          <li><a href="contact.html">Contact</a></li>
        </ul>
      </nav>
    </header>
      <div  class="banner">
        <img src="img/Kids-Well-Being-Health.jpg" alt="Kids Health">
      </div> 
      <br/>
      <div class="welcomeBar">
        <h2>Welcome To</h2>
        <h2><q>Donja's Well-Being For Kids</q></h2>
        <p><q>......Helping children to become calm, confident and resilient, by understanding and regulating their emotions, through Relax Kids&trade; and Emotional Literacy classes and workshops.</q></p>
      </div>
    <div id="wrapper">
      <section>
        <ul id="collections">
          <li>
              <a href="emotionalLiteracy1-1Support">
                <img src="img/Emotional-Literacy-1-1-Support.jpeg" alt="Emotional Literacy 1 on 1 Support">
                <p>Emotional Literacy 1-1 Support</p>
              </a>
          </li>
          <li>
              <a href="relaxKids">
                <img src="img/Relax-Kids-Online.jpg" alt="Relax Kids">
                <p>Relax Kids&trade;</p>
              </a>
          </li>
          <li>
              <a href="tipsToHelpYourChild">
                <img src="img/Tips-To-Help-Your-Child.jpeg" alt="Tips to Help Your Child">
                <p>Tips To Help Your Child</p>
              </a>
          </li>
          <li>
              <a href="helpWithParenting">
                <img src="img/Help-With-Parenting.jpeg" alt="Help With Parenting">
                <p>Help With Parenting</p>
              </a>
          </li>
          <li>
              <a href="classesAndWorkshops">
                <img src="img/Classes-And-Workshops.jpeg" alt="Classes and Workshops">
                <p>Classes and Workshops</p>
              </a>
          </li>
          <li>
              <a href="testimonials.html">
                <img src="img/Testimonials.jpg" alt="Testimonials">
                <p>Testimonials</p>
              </a>
          </li>
        </ul>
      </section>
      <footer>
<!--        <a href="http://twitter.com/lukebennettuk"><img src="img/twitter-wrap.png" alt="Twitter Logo" class="social-icon"></a>-->
        <a href="http://facebook.com/Donjaswellbeingforkids" target="_blank"><img src="img/facebook-wrap.png" alt="Facebook Logo" class="social-icon"></a>
        <p>&copy; 2017 Donja's Well-Being For Kids.</p>
      </footer>
    </div>
  </body>
</html>

CSS在这里：

代码语言：javascript
复制
    /*******************************************
GENERAL
********************************************/

body {
  font-family: 'Indie Flower', sans-serif;
/*  background-image: img/shining-blue-water-background.jpg;*/
  margin: 0;
  padding: 0;
}

#wrapper {
  max-width: 940px;
  margin: 0 auto;
  padding: 0 5%;
}

.centerText {
  text-align: center;
}

a {
  text-decoration: none;
}

img {
  max-width: 100%;
}

h3 {
  margin: 0 0 1em 0;
}



/*******************************************
HEADING
********************************************/

header {
  margin: 0 0 30px 0;
  padding: 5px 0 0 0;
  width: 100%;
}

#logo {
  display: block;
  width: 40%;
  margin: 5px auto;
}



/*******************************************
NAVIGATION
********************************************/

nav {
  text-align: center;
  padding: 10px 0;
}

nav ul {
  list-style: none;
  margin: 0 10px;
  padding: 0;
}

nav li {
  display: inline-block;
}

nav a {
  font-weight: 700;
  padding: 15px 10px;
  transition: .5s ease-out;
}



/*******************************************
BANNER
********************************************/

.banner {
  display: block;
  margin: -30px 0 0px 0;
}

.banner {
  width: 100%;
  display: block;
}

.banner img {
  position: relative;
  width: 100%;
  display: block;
}



/*******************************************
WELCOME BAR
********************************************/

.welcomeBar {
  float: left;
  width: 100%;
  text-align: center;
  display: block;
  margin: 0 0 15px;
}

.welcomeBar h2 {
  margin: 0;
}



/*******************************************
TOP BOX
********************************************/

.topBox {
  text-align: center;
  position: fixed;
  right: 0;
  bottom: 50px;
  background-color: #659EB8;
  height: 35px;
  width: 35px;
  border-radius: 50%;
}

.topBox i {
  position: relative;
  height: 100%;
  width: 100%;
  top: 6px;
}



/*******************************************
FOOTER
********************************************/

footer {
  font-size: 0.75em;
  text-align: center;
  clear: both;
  padding-top: 50px;
  width: 100%;
}

.social-icon {
  width: 20px;
  height: 20px;
  margin: 0 5px;
}



/*******************************************
PAGE: HOME: COLLECTIONS
********************************************/

#collections {
  margin: 0;
  padding: 0;
  list-style: none;
}

#collections li {
  float: left;
  width: 95%;
  margin: 2.5%;
}

#collections li a img{
  border: 5px solid;
  border-color: #f5f5f5; 
}

#collections li {
  position: relative;
  max-width: 100%;
}

#collections li a p {
  font-size: 100%;
  padding: 3px;
  white-space: nowrap;
  position: absolute;
  float: left;
  top: 40%;
  left: 52%;
  transform: translate(-50%, -50%); 
  transition: .5s ease-out;
  font-weight: bold;
}

#collections li a:hover p {
  transition: 0.5s;
  font-size: 105%;
}



/*******************************************
PAGE: ABOUT
********************************************/

.profile-photo {
  display: block;
  max-width: 200px;
  margin: 0 auto 30px;
  border-radius: 100%;
}



/*******************************************
PAGE: CONTACT
********************************************/

.contact-info {
  list-style: none;
  padding: 0;
  margin: 0;
  font-size: 0.9em;
}

.contact-info a {
  display: block;
  min-height: 20px;
  background-repeat: no-repeat;
  background-size: 20px 20px;
  padding: 0 0 0 30px;
  margin: 0 0 10px;
}

.contact-info li.fax {
  display: block;
  min-height: 20px;
  background-repeat: no-repeat;
  background-size: 15px 15px;
  background-position: left 3px bottom 5px;
  padding: 0 0 0 30px;
  margin: 0 0 10px;
}

.contact-info li.phone a {
  background-image: url('../img/phone.png');
}

.contact-info li.mail a {
  background-image: url('../img/mail.png');
  word-wrap: break-word;
}

.contact-info li.fax {
  background-image: url('../img/printer.png');
}

.contact-info li.facebook a {
  background-image: url('../img/facebook.png');
}



/*******************************************
PAGE: EMOTIONAL LITERACY
********************************************/

.emotionalLiteracy {
  text-align: center;
  padding: 15px;
  border-radius: 10px;
}



/*******************************************
PAGE: RELAX KIDS
********************************************/

.relaxKids {
  padding: 15px;
  border-radius: 10px;
}

.relaxKids li {
  margin: 0 17px;
}

.chill-skills-photo {
  display: block;
  max-width: 200px;
  margin: 0 auto 30px;
  border-radius: 2%;
}



/*******************************************
PAGE: TIPS TO HELP YOUR CHILD
********************************************/

.tips {
  padding: 15px;
  border-radius: 10px;
}

.tips li {
  margin: 0 17px;
}



/*******************************************
PAGE: HELP WITH PARENTING
********************************************/

.parenting {
  padding: 15px;
  border-radius: 10px;
}

.parenting-banner {
  display: block;
  margin: 0 0 30px;
  width: 100%;
  border-radius: 10px;
}



/*******************************************
PAGE: CLASSES AND WORKSHOPS
********************************************/

.workshops {
  text-align: center;
  padding: 15px;
  border-radius: 10px;
}

iframe {
  border: none;
  overflow:hidden;
}



/*******************************************
PAGE: TESTIMONIALS
********************************************/

.testimonials-lydia {
  padding: 1px;
  border-radius: 10px;
}

.testimonials-lydia p {
  margin: 5px 17px 0;
}

.testimonials-benjamin {
  margin: 10px 0;
  padding: 1px;
  border-radius: 10px;
}

.testimonials-benjamin p {
  margin: 5px 17px 0;
}

.testimonials-gabby {
  margin: 10px 0;
  padding: 1px;
  border-radius: 10px;
}

.testimonials-gabby p {
  margin: 5px 17px 0;
}

.testimonials-amy {
  margin: 10px 0;
  padding: 1px;
  border-radius: 10px;
}

.testimonials-amy p {
  margin: 5px 17px 0;
}

.testimonials-isabelle {
  margin: 10px 0;
  padding: 1px;
  border-radius: 10px;
}

.testimonials-isabelle p {
  margin: 5px 17px 0;
}

.testimonials-johnny {
  margin: 10px 0;
  padding: 1px;
  border-radius: 10px;
}

.testimonials-johnny p {
  margin: 5px 17px 0;
}


/*******************************************
COLORS
********************************************/

/* site body */
body {
  background-color: #fff;
  color: #000;
}

/* grey header */
header{
  background: #fff;
  border-color: #000;
}

/* nav background on mobile */
nav {
  background: #D4BDD7;
}

/* links */
a {
  color: #000;
}

/* nav link */
nav a, nav a:visited {
  color: #fff;
}

/* selected nav link */
nav a.selected, nav a:hover {
  color: #000;
  transition: .5s;
}

p.littleStars {
 color: blue; 
}

.welcomeBar {
  background-color: #659EB8;
}

#collections li a p {
  color: black;
  background: rgba(235, 229, 235, .3);
}

#collections li a:hover p {
  background: rgba(235, 229, 235, .9);
}

.emotionalLiteracy {
  background-color: #F15369;
  color: white;
}

.relaxKids {
  background-color: #8B5D8D;
  color: white;
}

.tips {
  background-color: #ECE272;
  color: black;
}

.parenting {
  background-color: #F4B97B;
  color: black;
}

.workshops {
  background-color: #71A87B;
  color: white;
}

/* testimonial boxes */
.testimonials-lydia {
  background-color: #F15369;
  color: white;
}

.testimonials-benjamin {
  background-color: #F4B97B;
  color: white;
}

.testimonials-gabby {
  background-color: #ECE272;
  color: white;
}

.testimonials-amy {
  background-color: #71AB7B;
  color: white;
}

.testimonials-isabelle {
  background-color: #2e619f;
  color: white;
}

.testimonials-johnny {
  background-color: #8B5D8D;
  color: white;
}

CyberDuck服务器文件的组织方式如下：

​

​

​

​

请帮帮忙，我似乎不能得到我想要的徽标出现。我试着重命名它，上传CSS和索引文件从头开始，所以他们精确的数学括号。但还是一无所获。我真的不明白我做错了什么。

非常感谢，

卢克

html
css
EN

回答 2

Stack Overflow用户

发布于 2017-08-21 19:48:23

我不明白为什么contact.html页面上的徽标会变小：

你知道为什么会这样吗：

代码语言：javascript
复制
  <!DOCTYPE html>
    <html>
     <head>
        <meta charset="utf-8">
        <title>Contact | Donja's Well-Being For Kids</title>
        <link rel="stylesheet" href="css/normalize.css">
        <link href="https://fonts.googleapis.com/css?family=Gloria+Hallelujah|Indie+Flower|Shadows+Into+Light|Shadows+Into+Light+Two" rel="stylesheet">
        <link rel="stylesheet" href="css/main.css">
        <link rel="stylesheet" href="css/responsive.css">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
       <link rel="favicon" type="image/png" href="img/Kids-Well-Being.png">
      </head>
      <body>
        <header>
          <a href="index.html" id="logo">
            <img id="logo" src="img/Donjas-Well-Being-For-Kids.png" alt="Donja's-Well-Being-For-Kids">
            <!--
            <h2 id="logo" class="centerText">Donja's Well-Being For Kids</h2>
            -->
          </a>
          <nav>
            <ul>
              <li><a href="index.html">Home</a></li>
              <li><a href="about.html">About</a></li>
              <!------------ PRODUCTS -------------------------------------
              <li><a href="products.html">Products</a></li>
              ------------------------------------------------------------->
              <li><a href="contact.html" class="selected">Contact</a></li>
            </ul>
          </nav>
        </header>
        <div id="wrapper">
          <section id="primary">
            <h3>General Information</h3>
            <p>For more details please contact me.</p>
            <p>I have a current DBS Certificate and also Public Liability Insurance.</p>
          </section>
          <section id="secondary">
            <h3>Contact Information</h3>
            <ul class="contact-info">
              <li class="phone"><a href="tel: 07916 337 916">Phone: 07916 337 916 </a></li>
              <li class="mail"><a href="mailto: Donja@Donjaswell-beingforkids.co.uk">Email: Donja@donjaswell-beingforkids.co.uk</a></li>
              <li class="facebook"><a href="https://www.facebook.com/messages/t/1724861014479447" target="_blank">CLick to Message me on Facebook!</a></li> 
            </ul>
    <!--
            <h3>Hours of Operation</h3>
            <p>Monday - Friday 8:00am - 5:30pm</p>
            <h3>Address</h3>
    -->
            <p></p>
          </section>
          <footer>
    <!--        <a href="http://twitter.com/lukebennettuk"><img src="img/twitter-wrap.png" alt="Twitter Logo" class="social-icon"></a>-->
            <a href="http://facebook.com/Donjaswellbeingforkids" target="_blank"><img src="img/facebook-wrap.png" alt="Facebook Logo" class="social-icon"></a>
            <p>&copy; 2017 Donja's Well-Being For Kids.</p>
          </footer>
        </div>
      </body>
    </html>
票数 0
EN

Stack Overflow用户

发布于 2017-08-21 19:21:56

​

​

网站运行正常。如果对您无效，请清除缓存或执行强制刷新/硬刷新。

票数 -1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：

https://stackoverflow.com/questions/45795660

复制
相关文章

相似问题

领券

腾讯云开发者

扫码关注腾讯云开发者

扫码关注腾讯云开发者

领取腾讯云代金券

热门产品

热门推荐

更多推荐

Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有 

深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 粤公网安备44030502008569号

腾讯云计算（北京）有限责任公司 京ICP证150476号 |  京ICP备11018762号

问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档