0

这些不仅仅是我正在谈论的任何按钮..而是每个问题或答案下的按钮，上面写着“编辑”、“标记”、“询问相关问题”、“答案”等。

这些按钮中的每一个都位于父 div“qa-q-view-buttons”下。

以本节为例...

这是它现在的样子：

当前的

以及它现在看起来的 HTML ......

<div class="qa-q-view-buttons">
<input name="q_doedit" value="edit" title="Edit this question" type="submit" class="qa-form-light-button qa-form-light-button-edit">
<input name="q_doclose" value="close" title="Close this question to any new answers" type="submit" class="qa-form-light-button qa-form-light-button-close">
<input name="q_dohide" onclick="qa_show_waiting_after(this, false);" value="hide" title="Hide this question" type="submit" class="qa-form-light-button qa-form-light-button-hide">
<input name="q_doanswer" id="q_doanswer" onclick="return qa_toggle_element('anew')" value="answer" title="Answer this question" type="submit" class="qa-form-light-button qa-form-light-button-answer">
</div>

通过做一些简单的 HTML 编辑。我可以很容易地为这些按钮添加 Font Awesome。

这是我可以做的一些修改，以完全按照我的意愿进行。

<div class="qa-q-view-buttons">
<button name="q_doedit" value="edit" title="Edit this question" type="submit" class="qa-form-light-button qa-form-light-button-edit">
<i class="fa fa-edit"></i> Edit</button>
<button name="q_doclose" value="close" title="Close this question to any new answers" type="submit" class="qa-form-light-button qa-form-light-button-close">
<i class="fa fa-close"></i> Close </button>
<button name="q_dohide" onclick="qa_show_waiting_after(this, false);" value="hide" title="Hide this question" type="submit" class="qa-form-light-button qa-form-light-button-hide">
<i class="fa fa-eye-slash"></i> Hide</button>
<button name="q_doanswer" id="q_doanswer" onclick="return qa_toggle_element('anew')" value="answer" title="Answer this question" type="submit" class="qa-form-light-button qa-form-light-button-answer">
<i class="fa fa-comment"></i> Comment</button>
</div>

最终看起来像这样..

新的

唯一的问题？Q2A 不能直接进行 HTML 编辑。我在 Google Chrome 上的源代码编辑器的“检查元素”->“编辑为 HTML”部分中进行了这些更改。这意味着我需要对 Q2A 的 qa-theme-base.php 文件进行排序并直接使用 PHP 代码对其进行编辑，对吗？

谁能指出我正确的方向？我不知道从哪里开始。

4

1 回答 1

0

要添加图标，<i class="fa fa-edit"></i>您需要在生成此按钮的代码的任何位置更改 PHP 文件（我不记得现在在哪里），以便添加<i class>. 但是，不要使用<i>默认建议实现图标的方式，您总是可以使用 hacks 来做同样的事情，比如不使用<i>标签，您可以将它用作:before您想要实现这些图标的类，

它会是这样的：

.qa-form-light-button-edit:before {
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    content: "\f040";
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    
    margin-right:3px; /* Add a margin if you want */

    /* code below same as Font-awesome .fa-fw for 'navigation' icons */
    width: 1.28571429em;
    text-align: center;
}
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous">
<!-- example of normal Q2A Edit button below -->
<button name="q_doedit" value="edit" title="Edit this question" type="submit" class="qa-form-light-button qa-form-light-button-edit">Edit</button>

于 2015-06-18T19:20:07.457 回答