无法让我的标签在 <a> GitHub 网页中工作(但在 Codepen 上工作正常)



作为freecodecamp课程的一部分,我创建了一个随机引用生成者网页,现在正在将文件上传到github,以便它们可以作为自己的网页托管在那里。该页面在代码笔中运行良好,但是当我将页面上传到 github 时,"按钮"不起作用。我不知道为什么。我将不胜感激有关此问题的任何反馈和见解!(我对Web开发和编码很陌生,所以如果这是一个愚蠢/简单的错误,我提前道歉)谢谢!

我也不确定为什么 github 版本的字体这么小:/

代码笔上的页面 - https://codepen.io/armte312/pen/Qrvyjr

GitHub 网页 - https://armte.github.io/quotegen.github.io/

GitHub 存储库 - https://github.com/armte/quotegen.github.io

有问题的代码:

<div class="button-row" id="button-row">
<a class="button tweet-quote" href="#" id="tweet-quote"><i class="fab fa-twitter-square"></i></a>
<a class="button new-quote-btn" href="#" id="new-quote-btn">New Quote</a>
</div><!--End of button-row !-->

我尝试使用 z-index 属性,因为我不确定其他元素是否可能"在"a 标签的"前面",但这似乎不起作用。 还尝试了更新版本的引导程序,但这似乎也不重要。

"新报价"按钮(标签)应该对悬停在其上方的光标以及单击它时做出反应,但它两者都没有......

你把你的jquery设置为

<script type="text/javascript" src="jquery-3.3.1.js"></script>

虽然你的 GitHub 存储库中没有该文件的名称。请改用此代码

<script type="text/javascript" src="https://code.jquery.com/jquery-3.3.1.js"></script>

删除重复项

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<!DOCTYPE html>
<html lang="en">

相关内容