Images in github pages and relative links

后端 未结 2 1389
春和景丽
春和景丽 2020-12-05 22:38

I created a user\'s github page.

Now, suppose I have an Image file at the root of the repo located as Images/Emoticons/Cool.png

I try to inser

相关标签:
2条回答
  • 2020-12-05 23:12

    As the site is being served by Linux servers, the path is case sensitive.

    In order to make this work, replace emoticons with Emoticons in the provided url.

    Screenshot of the repository

    Also, in a URL, replace the backslash (\) by a forward slash (/).

    The following HTML code should properly display the image

    <img src="images/Emoticons/cool.png" alt="hi" class="inline"/>
    
    0 讨论(0)
  • 2020-12-05 23:21
    try this
    
        <img src="images/emoticons/cool.png" alt="hi" class="inline"/>
    
    Full Page 
    
    <!DOCTYPE html>
    <html>
    
      <head>
        <meta charset='utf-8' />
        <meta http-equiv="X-UA-Compatible" content="chrome=1" />
        <meta name="description" content="Home Page : My Github Web" />
    
        <link rel="stylesheet" type="text/css" media="screen" href="stylesheets/stylesheet.css">
    
        <title>Home Page</title>
      </head>
    
      <body>
    
        <!-- HEADER -->
        <div id="header_wrap" class="outer">
            <header class="inner">
              <a id="forkme_banner" href="https://github.com/Avi-Aryan">View on GitHub</a>
    
              <h1 id="project_title">Home Page</h1>
              <h2 id="project_tagline">Avi Aryan</h2>
    
            </header>
        </div>
    
        <!-- MAIN CONTENT -->
    <div id="main_content_wrap" class="outer">
        <section id="main_content" class="inner">
        <br />
        Hi ! <img src="images/emoticons/cool.png" alt="hi" class="inline"/><br /><br />
        I am a young coder currently having school time in India.<br />
        I love intelligent-coding, algorithms and logics and<br />
        enjoy playing Cricket and Badminton.<br />
        <br />
        My coding abilities are currently limited Autohotkey and only Autohotkey.<br />
        A listing of my Autohotkey works can be found <a href="Autohotkey.html">here</a>.<br />
        <br />
        You can always visit my <a href="http://www.avi-win-tips.blogspot.com">blog</a> if you are looking for cool tricks and cracks.<br />
        I write original , hard to find content.<br />
        <br />
        <hr><br />
        <h3>My Github Project List</h3>
        <ul>
        <li><a href="https://github.com/Avi-Aryan/Clipjump">Clipjump</a>
        <li><a href="https://github.com/Avi-Aryan/Sublime4Autohotkey">Sublime 4 Autohotkey</a>
        <li><a href="https://github.com/Avi-Aryan/AutoHotKey">Sublime Text Autohotkey Package</a>
        </ul><br />
        <h3>Other Links</h3>
        <ul>
        <li><a href="Autohotkey.html">Autohotkey Scripts Listing</a>
        <li><a href="http://avi-win-tips.blogspot.in/p/my-autohotkey.html">Blog Index</a>
        </ul>
        <br /><br />
        </section>
    </div>
    
        <!-- FOOTER -->
        <div id="footer_wrap" class="outer">
        <footer class="inner">
            <h2><font color="#FFFFFF">Profiles</font></h2>
            <p>
                <a href="http://www.github.com/avi-aryan">Github</a><br />
                <a href="http://www.autohotkey.com/board/user/24563-a-v-i/">Autohotkey Forum</a><br />
                <a href=https://plus.google.com/110328513842183229282">Google +</a><br />
                <a href="http://www.avi-win-tips.blogspot.com">Blog</a>
            </p>
        </footer>
    
    
    
      </body>
    </html>
    
    0 讨论(0)
提交回复
热议问题