Question

我想将twitters svg图标添加到

 <!DOCTYPE html>

    <head>
        <title>Andis Place</title>
        <link rel="stylesheet" type="text/css"href="stylesheet.css"/>

        </head>

        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

            <body style="font-family:Courier New;" bgcolor="White"
        <head>
                <h1 style="color:Orange;"> <center>Welcome to Andis Place</center></h1>
            </head>
        </body>

        <body>
        <p style="font-size:15px;">Enjoy… </p>
       <!DOCTYPE html>
      <html>
    <head>
     <style>
    ul {
        list-style-type: none;
        margin: 0;
        padding: 0;
        width: 200px;
        background-color: #6CCFFF;
    }

    li a {
        display: block;
        color: #6CCFFF;
        padding: 18px 16px;
        text-decoration: none;
    }

    /* Change the link color on hover */
    li a:hover {
        background-color:#dde7f2;
        color:Blue;
    }
    </style>
    </head>
    <body>


    <ul>

      <li class="external-link">
              <a href="https://soundcloud.com/palomazee" target="_blank">Soundcloud</a>
            </li>
     <li class="external-link">
              <a href="" target="_blank">Shop</a>
            </li>
      <li class="external-link">
              <a href="" target="_blank">Photos</a>
            </li>
      <li class="external-link">
              <a href="" target="_blank">About Me</a>
            </li>
    </ul>

    </body>


    <head>

    <style>


    ul {
        list-style-type: none;
        margin: 0;
        padding: 0;
        overflow: hidden;
        background-color: #6CCFFF;
    }

    li {
        float: center;
    }

    li a {
        display: block;
        color: Blue;
        text-align: center;
        padding: 14px 16px;
        text-decoration: none;
    }

    li a:hover:not(.active) {
        background-color:White;
    }

    .active {
        background-color: #6CCFFF;
    }
    </style>
    </head>
    <body>
    **<a href="http://twitter.com/minimalmonkey" class="icon-button twitter"><i class="icon-twitter"></i><span></span></a>
    <a href="http://facebook.com" class="icon-button facebook"><i class="icon-facebook"></i><span></span></a>
    <a href="http://plus.google.com" class="icon-button google-plus"><i class="icon-google-plus"></i><span></span></a>**
    </body>












    </html>

这是来自twitter图像的svg代码，当我使用inspect元素或将文件传输到文本管理器时，我得到了这个。

<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
     viewBox="0 0 400 400" style="enable-background:new 0 0 400 400;" xml:space="preserve">
<style type="text/css">
    .st0{opacity:0.15;fill:#292F33;}
    .st1{fill:#FFFFFF;}
</style>
<g id="_x31_0_x2013_20_x25__Black_Tint">
    <rect class="st0" width="400" height="400"/>
</g>
<g id="Logo__x2014__FIXED">
    <g>
        <path class="st1" d="M153.6,301.6c94.3,0,145.9-78.2,145.9-145.9c0-2.2,0-4.4-0.1-6.6c10-7.2,18.7-16.3,25.6-26.6
            c-9.2,4.1-19.1,6.8-29.5,8.1c10.6-6.3,18.7-16.4,22.6-28.4c-9.9,5.9-20.9,10.1-32.6,12.4c-9.4-10-22.7-16.2-37.4-16.2
            c-28.3,0-51.3,23-51.3,51.3c0,4,0.5,7.9,1.3,11.7c-42.6-2.1-80.4-22.6-105.7-53.6c-4.4,7.6-6.9,16.4-6.9,25.8
            c0,17.8,9.1,33.5,22.8,42.7c-8.4-0.3-16.3-2.6-23.2-6.4c0,0.2,0,0.4,0,0.7c0,24.8,17.7,45.6,41.1,50.3c-4.3,1.2-8.8,1.8-13.5,1.8
            c-3.3,0-6.5-0.3-9.6-0.9c6.5,20.4,25.5,35.2,47.9,35.6c-17.6,13.8-39.7,22-63.7,22c-4.1,0-8.2-0.2-12.2-0.7
            C97.7,293.1,124.7,301.6,153.6,301.6"/>
    </g>
</g>
</svg>

我试图在圈子中添加不同社交媒体的图标。https://www.hackerearth.com/problem/algorithm/remove-friends-5

在哪里添加我的svg图像以使其成为链接？

0 个答案: