2017-06-05 88 views
-1

另一個快速提問。我已經在不同的代碼集中看到過多次。有人呼籲從CSS圖像CSS字體圖像

HTML:

<a href="#"><i class="icon-map-marker2"></i></a> 

CSS

.icon-map-marker2:before { 
    content: "\e6f9"; 
} 

它給出了這樣的輸出:

enter image description here

正如你所看到的圖片不透明背景。我正在尋找編輯它給它透明度,但似乎無法找出如何。我也試着用CSS之類的東西:

style="background-color:rgba(0, 0, 0, 0.5);" 
// Changing the last value's number though and stuff like that 
opacity: 1; 
// etc 

我想保持黃金的顏色,但有一個透明的背景!感謝您的幫助!

一個例子是在畫布上實時預覽 - 懸停首頁 - >單頁:http://preview.themeforest.net/item/canvas-the-multipurpose-html5-template/full_screen_preview/9228123?_ga=2.252490057.1116575863.1496646725-686174233.1494200798

+0

你有一個在線樣本,我們可以看到這個嗎?也許jsfiddle? – ericosg

+0

我不完全確定代碼是如何工作的,它是與字體圖標或類似的東西。不完全確定,試圖弄清楚自己:/它是nto我已經使用過的字體真棒 –

+0

沒有[MCVE]我們可以在這裏猜測。如果我們不能複製這個問題,那麼很難幫助你。 –

回答

1

嘗試添加CSS爲a標籤的背景色:

a{ 
    background:transparent; 
} 

背景的形式.fbox圖標此div ..只需添加css即可

.feature-box.fbox-bg.fbox-center .fbox-icon { 
    background-color:transparent; 
} 
+0

沒有改變任何東西,雖然 –

+0

你可以添加工作演示或代碼鏈接,所以我們可以幫助你嗎? –

+0

http://preview.themeforest.net/item/canvas-the-multipurpose-html5-template/full_screen_preview/9228123?_ga=2.252490057.1116575863.1496646725-686174233.1494200798 這有它在底部 –

0

一個選項...下載照片並將其保存爲帶有透明BG的PNG。

我個人使用Photoshop,雖然有一個名爲Gimp - Free & Open Source Image Editor的免費軟件,它可以讓你格式化透明的照片,然後將它們保存爲.png

  • 典型方法涉及在本地保存的圖像時,編輯和
    出口爲透明的PNG。

  • 右鍵單擊瀏覽器中的託管照片,然後選擇Open Image In New Tab

  • 新打開的選項卡內右鍵點擊圖片,選擇Save link as,然後選擇目標文件夾。

  • 打開您的圖像編輯軟件,如果需要,請參閱我的GIMP鏈接。

  • 通常情況下,如果BG和 圖像之間有良好的對比度,或者背景是單色,則與您的情況相同。您可以使用魔術棒工具將圖像從背景中拉出。

  • 您還可以使用lasso工具進行選擇,在那裏對選區進行繪製。但是,這種方法有點繁瑣且耗時。

  • 一旦你選擇了你想要移除的背景圖像,只需點擊刪除按鈕刪除選定的像素。*請確保您選擇背景,而不是刪除時的圖像!

  • 只有羽化,如果你有柔軟的邊緣,如果不跳羽化。

  • 羽毛:羽毛的選擇。在Select-> Modify-> Feather下。輸入一個像.5這樣的低數字,儘管您可能需要嘗試找到合適的數量 ,以便在需要時柔化您的柔軟邊緣。然後選擇反演並刪除選定的反演以應用羽化並軟化邊緣。

  • 現在將您的圖像導出爲.png文件並將其託管,以便您可以鏈接到新的透明圖像。

  • 在Photoshop中,你會選擇File->Save For Web選擇PNG-24,並選擇Transparent

    • 注意大小,預覽如果需要的話,然後保存。
  • 現在在imgur或其他IMG的網站和鏈接重新託管您的網站的圖像文件結構中或網上新發布的 透明的照片。