--- id: bad87fee1348bd9aedc08845 title: Add Font Awesome Icons to all of our Buttons required: - link: 'https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.2.0/css/font-awesome.css' raw: true challengeType: 0 videoUrl: '' localeTitle: 将Font Awesome Icons添加到我们所有的按钮中 --- ## Description
Font Awesome是一个方便的图标库。这些图标是矢量图形,以.svg文件格式存储。这些图标就像字体一样对待。您可以使用像素指定其大小,并且它们将采用其父HTML元素的字体大小。使用Font Awesome将info-circle图标添加到信息按钮,将trash图标添加到删除按钮。注意: span元素是下面方向的i元素的可接受替代方法。
## Instructions
## Tests
```yml tests: - text: 您应该在info按钮元素中添加<i class="fa fa-info-circle"></i> 。 testString: assert($(".btn-info > i").is(".fas.fa-info-circle") || $(".btn-info > span").is(".fas.fa-info-circle")); - text: 您应该在删除按钮元素中添加<i class="fa fa-trash"></i> 。 testString: assert($(".btn-danger > i").is(".fas.fa-trash") || $(".btn-danger > span").is(".fas.fa-trash")); - text: 确保每个i元素都有一个结束标记, <i class="fa fa-thumbs-up"></i>就在你的按钮元素中。 testString: assert(code.match(/<\/i>|<\/span/g) && code.match(/<\/i|<\/span>/g).length > 2 && ($(".btn-primary > i").is(".fas.fa-thumbs-up") || $(".btn-primary > span").is(".fas.fa-thumbs-up"))); ```
## Challenge Seed
```html

CatPhotoApp

A cute orange cat lying on its back.
Three kittens running towards the camera.

Things cats love:

  • cat nip
  • laser pointers
  • lasagna

Top 3 things cats hate:

  1. flea treatment
  2. thunder
  3. other cats
```
## Solution
```js // solution required ```