Question

我正在设计联系表格。我想在输入字段中添加字体令人讨厌的图标。我通过在外部css中使用字体图标的备忘单添加图标。我想使用作弊码调整图标的大小。

我的CSS代码就是这个 -

 .wpcf7-form span
    {
    position: relative; /* Helps curtail overlap */
    border: solid 1px #bbb;
    padding: 3px 5px 5px 25px; /* Adjust as needed */
    }
    .wpcf7-form span.input {
    border: none;
    }
    .wpcf7-form span:before {
    content: '\fa-2x f206';
    position: absolute;
    left: 5px;
    font-family: fontAwesome;
    color: #888; /* Your desired color */
    }

HTML是 -

<p>[text* your-name placeholder "Name"] </p>

<p>[email* your-email placeholder "Email"]</p>

<p>[tel* tel-427 placeholder "Phone"]</p>

<p>[textarea your-message placeholder "Message"] </p>

<p style="text-align:right;">[submit "Send"]</p>

Answer 1

Font awesome提供了设置ico大小的选项。它们提供1x至5x。您可以为表单选择合适的大小。

Answer 2

使用css，您可以使用font-size选项更改图标大小。

用法：＆＃39; .fa.fa-icon * { font-size：1em（或在px中）; }`

如何使用css中的备忘单来保存字体令人讨厌的图标？

2 个答案: