font-awesome

Fontawesome Cross origin issues

流过昼夜 提交于 2019-12-10 11:15:06
问题 I want to load Fontawesome from a CDN but I get failed cross-origin request. Resource access is restricted I know that to fix this a HTTP header should be added, but is there any way to avoid doing this? I tried replacing '../font/fontawesome-webfont.eot?v=3.2.0') with full urls but it didnt help for some reason. Is there anything that can be done without the header? 回答1: This is browsers’ same-origin policy restrictions http://www.w3.org/TR/css3-fonts/#same-origin-restriction. If you are

Flipping an icon and spinning it in reverse

我与影子孤独终老i 提交于 2019-12-10 11:05:25
问题 There's an icon in the Font Awesome set that I want to flip horizontally and then spin in that direction, which is the opposite of the regular spin effect. There are a number of ways to do each, but none that I know that will do both since the effects seem to cancel each other out? If I flip it, .fa-refresh { -moz-transform: scaleX(-1); -o-transform: scaleX(-1); -webkit-transform: scaleX(-1); transform: scaleX(-1); filter: FlipH; -ms-filter: "FlipH"; } then animate it, .icon-spin-reverse {

jQuery Accordion change font awesome icon class on click

老子叫甜甜 提交于 2019-12-10 10:07:56
问题 I have a question about a simple jQuery accordion I found. I'd like to use Font Awesome icons to indicate the active/inactive state with plus and minus icons. In my JSFiddle you see the accordion titles with plus icons. When you click on a title the "fa-plus" class needs to change to "fa-minus". I already did some tests with add and removeClass, but I couldn't get it working. I'm really a jQuery/javascript noob! Hope you guys can help me out :-). jQuery('.accordion dt').click(function() {

Some font awesome icon not displaying

荒凉一梦 提交于 2019-12-10 09:23:18
问题 I can see icon-screenshot, icon-map-marker being rendered fine but don't see anything when using icon-paper-clip or icon-group or icon-link ... what could possibly be wrong? Anyone here experienced the same issue? 回答1: Based on the official troubleshooting guide these are the things you should check: General You don't have an old version of Font Awesome installed on your system (it may have priority); [If you are serving Font Awesome from your own server] Both your font-awesome.css file and

How to integrate FontAwesome 5 Pro with React?

耗尽温柔 提交于 2019-12-10 09:22:50
问题 Could someone advice me on how to integrate FontAwesome 5 Pro with React? I know there are packages @fortawesome/react-fontawesome and for example @fortawesome/fontawesome-free-regular but is there a way how to include pro version of icons? When I log in to FontAwesome website, I can download the pro-version JS but I guess that's of no use in React. 回答1: Here's how to integrate Font Awesome 5 Pro with React (2018): Purchase a Pro licence from Font Awesome's pricing page Upon success, ignore

how to stylize a circle Fontawesome icon background?

六眼飞鱼酱① 提交于 2019-12-10 05:16:44
问题 Is there is a simple way to stylize the Fontawesome icons background properly? I was trying to do it with the icon-remove-sign (which has the particularity to be a circle) icon in order to make appear the cross in white and the circle in red. The difficulty is that the icon is recognize as a square, so i was trying to make it a circle in order to apply the red background color (but i am wondering if there is not something simpler): .icon-remove-sign { padding: 0; border-radius: 25px; color:

How to use fontawesome in Chrome Extension?

▼魔方 西西 提交于 2019-12-10 04:37:12
问题 I am developing a Google Chrome Extension that is displayed on a specific website. And I want to use Fontawesome in my chrome extension. When I try to load fonts, the error GET chrome-extension://invalid/ net::ERR_FAILED occured. In the stylesheet, webfonts are included with @font-face like this. src: url('chrome-extension://__MSG_@@extension_id__/Fonts/fontawesome-webfont.eot?v=4.7.0'); I also tried to embed my extension id directly, though it doesn't work. My manifest.json: "web_accessible

why some of the font-awesome icons does not show

一个人想着一个人 提交于 2019-12-10 01:57:09
问题 I am using font-awesome with Angular 5 for my UI. Since I am using sass , I added the following line in .angular-cli.json after installing font-awesome "styles": [ "../node_modules/font-awesome/scss/font-awesome.scss", "../node_modules/bootstrap/scss/bootstrap.scss", "styles.scss" ], Some of the icons works such as <i class="fa fa-money blue-text"></i> <i class="fa fa-code blue-text"></i> However a lot more does not. For example, I wanted to use this bar chart icon with fas fa-chart-bar , but

effect of aria-hidden in fontAwesome

北战南征 提交于 2019-12-09 14:49:58
问题 what's the effect of aria-hidden in fontAwesome? Is it necessary to use it? why? or why not? for example I want to know the effect of aria-hidden="true" in the code below <i class="fa fa-star" aria-hidden="true"></i> please help me. 回答1: In short, it makes the icon not visible to screen readers, to enhance accessibility. From the documentation: If you're using an icon to add some extra decoration or branding, it does not need to be announced to users as they are navigating your site or app

How do I add a Font Awesome icon to file input field

孤人 提交于 2019-12-09 13:46:20
问题 I have a file input button, instead of browse I want to show Font Awesome upload icon there but whatever I tried nothing gave me result. Here is what I've tried: .select-wrapper { background: url(http://s10.postimg.org/4rc0fv8jt/camera.png) no-repeat; background-size: cover; display: block; position: relative; width: 33px; height: 26px; } #image_src { width: 26px; height: 26px; margin-right: 100px; opacity: 0; filter: alpha(opacity=0); /* IE 5-7 */ } <div class="container"> <span class=