Adding a link to a span item-CodePudding

So I'm trying to add a link on each item from this list, I tried using but it breaks the animation and adds the first link to every item on the list, tried using data-url="link" inside the span, that doesn't work at all, here's the code, any help would be extremely appreciated.

index.html -

<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <link rel="stylesheet" href="styles.css">
  <title>SKZ Romania</title>
</head>
<body>
  <ul >
    <li >
      <span  data-text="FORUM">FORUM</span>
    </li>
    <li >
      <span  data-text="LISTĂ BAN-URI">LISTĂ BAN-URI</span>
    </li>
    <li >
      <span  data-text="TOP RANK-URI">TOP RANK-URI</span>
    </li>
    <li >
      <span  data-text="DISCORD">DISCORD</span>
    </li>
  </ul>
</body>
</html>

CodePudding user response：

You can not add link to span. if you want to add link, You must use <a> tag !

for this you have to put the span inside the a tag like this:

<a href="http://yourUrl"> <span> your text </span> </a>

and for the animations, you have to change animation functions!

CodePudding user response：

try this one, i made a link for the first two items:

<ul >
<li >
<span  data-text="FORUM"><a 
href="stylesheet" > froum </a></span>

</li>
<li >
<span  data-text="LIST? BAN- 
URI"> <a href="styles.css">  LIST? BAN-URI </a> 
</span>

</li>