简体   繁体   English

Excel使用FontAwesome打开HTML文件

[英]Excel open HTML file with FontAwesome

Using Excel you can open up HTML files and if they containt TABLE tags these will be rendered correctly in XLS. 使用Excel可以打开HTML文件,如果它们包含TABLE标记,则可以在XLS中正确呈现这些文件。

Now I have a TABLE and some cells have FontAwesome icons in them. 现在,我有了一个表格,一些单元格中有FontAwesome图标。 These will not show up in Excel. 这些将不会显示在Excel中。

In a normal Excel file I can use FontAwesome with no problem. 在普通的Excel文件中,我可以毫无问题地使用FontAwesome。 To achieve this I downloadeded FontAweseme and installed the FontAwesome.otf font. 为此,我下载了FontAweseme并安装了FontAwesome.otf字体。 Now when I select a cell in Excel, and I set the FontAwesome font, I can copy an icon from http://fortawesome.github.io/Font-Awesome/cheatsheet/ and paste it into Excel and it will display correctly. 现在,当我在Excel中选择一个单元格并设置FontAwesome字体时,我可以从http://fortawesome.github.io/Font-Awesome/cheatsheet/复制一个图标并将其粘贴到Excel中,它将正确显示。

However, I want to achieve this by importing a HTML file into Excel... 但是,我想通过将HTML文件导入Excel来实现这一目标。

HTML example file : HTML示例文件:

<html>
  <head>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.1/css/font-awesome.min.css">
  </head>
  <body>
    <table>
      <tr>
        <td>hello</td>
        <td>world</td>
      </tr>
      <tr>
        <td>Hello</td>
        <td><i class="fa fa-globe"></td>
      </tr>

  </body>
</html>

When you save put this in a file and save it as test.html, you can open it in your Browser and you will see the FontAwesome icon. 保存后,将其保存在文件中并另存为test.html,可以在浏览器中将其打开,然后会看到FontAwesome图标。 When save this as test.xls you can open it in Excel. 将其另存为test.xls时,可以在Excel中打开它。 All is rendered correctly in the correct cells, except the FontAwesome icon is missing. 除缺少FontAwesome图标外,所有文件均在正确的单元格中正确呈现。 Anyone any idea on how to fix this ? 任何人都知道如何解决这个问题?

I found it :-) 我找到了 :-)

You have to use the unicode inside an i tag. 您必须在i标签内使用unicode。 But you have to trigger the fontawesome css to work by using a class. 但是您必须通过使用类来触发fontawesome CSS才能工作。 Now if you use a normal class like "fa fa-home" you will get the icon twice. 现在,如果您使用“ fa fa-home”之类的常规类,您将获得两次图标。 But if you just use "fa" as the class, the FontAwesome magic gets triggered and it works. 但是,如果仅使用“ fa”作为类,则FontAwesome魔术会被触发并且可以正常工作。

The following HTML will render correctly with a FontAwesome icon :-) 以下HTML将使用FontAwesome图标正确呈现:-)

 <html> <head> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.1/css/font-awesome.min.css"> </head> <body> <table> <tr> <td>hello</td> <td>world</td> </tr> <tr> <td>Hello</td> <td>I am <i class="fa" style="color: red;">&#xf015;</i> a house !</td> </tr> </table> </body> </html> 

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM