a href =（社交媒体）dosn在ul / li工作

Question

我正在尝试创建一个联系页面，而且我正在努力使用社交媒体的href-tags。当我尝试点击它时，它不会去任何地方或做任何事情。谁知道问题是什么？

＆＃13;

＆＃13;

html {
  height: 100%;
  box-sizing: border-box;
  background-color: #001725;
  color: white;
  
  h4 {
    font-size: 30px;
    letter-spacing: 5px;
    text-decoration-style: solid;
    margin-top: 1rem;
    margin-bottom: 0.5rem;
    text-align: right;
}

p {
    margin-bottom: 1.5rem;
}

li {
    list-style-type: none;
}

/*Links*/
/* unvisited link */
a {
    text-decoration: none;
}

a:link {
    color: slategrey;
}

/* visited link */
a:visited {
    color: powderblue;
}

/* mouse over link */
a:hover {
    color: ghostwhite;
}

/* selected link */
a:active {
    color: hotpink;
}

＆＃13;

<!--Begin Article: Text-->
 <article class="text_column">
  <h2>CONTACT<br>&amp;SOCIAL MEDIA</h2>

  <p class="text">
    Sawadee kah&excl;
    <br>
    I&apos;d like to show you some information of my working experiance, projects and passion. I hope you&apos;ll get inspired, so let&apos;s have look around <i class="far fa-smile"></i>.
  </p>
  
  <p id="right">
       <ul>
        <li><h4><a href="https://twitter.com/alice_ticha"></a>Twitter <i class="fab fa-twitter"></i></h4></li>
        <li><h4><a href="https://www.facebook.com/MadPandaCosplayArt/"></a>Facebook <i class="fab fa-facebook-square"></i></h4></li>
        <li><h4><a href="https://www.instagram.com/MadPanda_Cosplay_Art/"></a>Instagram <i class="fab fa-instagram"></i></h4></li>
        <li><h4><a href="https://madpandacosplayart.tumblr.com/"></a>Tumblr <i class="fab fa-tumblr-square"></i></h4></li>
    </ul>
     </p>
     </article>
<!--End Article: Text-->

＆＃13;

＆＃13;

＆＃13;

（我很抱歉，如果代码非常混乱，只需用括号开始编码。）并感谢您的支持！

Answer 1

您必须在标记a中设置文本（或标记li）以设置元素上的链接

<a href="https://madpandacosplayart.tumblr.com/">Tumblr</a>

顺便说一下，你的i标签是一样的

Answer 2

您的文字需要位于锚标记内。由于锚标记内部没有任何内容，因此不会呈现可点击的表面。

Answer 3

<li><h4><a href="https://twitter.com/alice_ticha">Twitter</a> <i 
class="fab fa-twitter"></i></h4></li>

在Twitter

一词后关闭a标签

Answer 4

你做的是

gf.update_screen

但是您应该通过<a href="https://twitter.com/alice_ticha"> </a> Twitter <i class="fab fa-twitter"></i> 包装文本以将其作为链接 像那样

href

＆＃13;

＆＃13;

<a href="https://twitter.com/alice_ticha">
  Twitter <i class="fab fa-twitter"></i>
</a>

＆＃13;

    html {
      height: 100%;
      box-sizing: border-box;
      background-color: #001725;
      color: white;
      
      h4 {
        font-size: 30px;
        letter-spacing: 5px;
        text-decoration-style: solid;
        margin-top: 1rem;
        margin-bottom: 0.5rem;
        text-align: right;
    }

    p {
        margin-bottom: 1.5rem;
    }

    li {
        list-style-type: none;
    }

    /*Links*/
    /* unvisited link */
    a {
        text-decoration: none;
    }

    a:link {
        color: slategrey;
    }

    /* visited link */
    a:visited {
        color: powderblue;
    }

    /* mouse over link */
    a:hover {
        color: ghostwhite;
    }

    /* selected link */
    a:active {
        color: hotpink;
    }

＆＃13;

＆＃13;

＆＃13;

Answer 5

你不匹配文字

＆＃13;

＆＃13;

html {
  height: 100%;
  box-sizing: border-box;
  background-color: #001725;
  color: white;
  
  h4 {
    font-size: 30px;
    letter-spacing: 5px;
    text-decoration-style: solid;
    margin-top: 1rem;
    margin-bottom: 0.5rem;
    text-align: right;
}

p {
    margin-bottom: 1.5rem;
}

li {
    list-style-type: none;
}

/*Links*/
/* unvisited link */
a {
    text-decoration: none;
}

a:link {
    color: slategrey;
}

/* visited link */
a:visited {
    color: powderblue;
}

/* mouse over link */
a:hover {
    color: ghostwhite;
}

/* selected link */
a:active {
    color: hotpink;
}

＆＃13;

<!--Begin Article: Text-->
 <article class="text_column">
  <h2>CONTACT<br>&amp;SOCIAL MEDIA</h2>

  <p class="text">
    Sawadee kah&excl;
    <br>
    I&apos;d like to show you some information of my working experiance, projects and passion. I hope you&apos;ll get inspired, so let&apos;s have look around <i class="far fa-smile"></i>.
  </p>
  
  <p id="right">
       <ul>
        <li><h4><a href="https://twitter.com/alice_ticha">Twitter <i class="fab fa-twitter"></i></a></h4></li>
        <li><h4><a href="https://www.facebook.com/MadPandaCosplayArt/">Facebook <i class="fab fa-facebook-square"></i></a></h4></li>
        <li><h4><a href="https://www.instagram.com/MadPanda_Cosplay_Art/">Instagram <i class="fab fa-instagram"></i></a></h4></li>
        <li><h4><a href="https://madpandacosplayart.tumblr.com/">Tumblr <i class="fab fa-tumblr-square"></i></a></h4></li>
    </ul>
     </p>
     </article>
<!--End Article: Text-->

＆＃13;

＆＃13;

＆＃13;