圓形圖像？

我正在用PHP製作一個網站，用戶上傳圖片作爲他們的個人資料。我已經有這個工作很好。但是，我希望用戶圖像爲圓形。從我看過的內容來看，我相信我不能將圖像裁剪成一個圓圈，我不得不掩蓋圖像以使圖像的一部分透明。我真的不知道從哪裏開始。如果有人能指出我正確的方向，或者甚至有一些示例代碼，我會非常感激！圓形圖像？

來源

2011-08-22 user906357

您是使用gd還是ImageMagick，或者您甚至已經獲得了那麼多？ –

這不是最具跨瀏覽器的解決方案，但可以使用CSS來完成。 – Bojangles

只需將圖像保存爲正方形，然後使用圓角修剪圖像。

您將圖像設置爲div中的背景圖像，並將CSS設置爲具有圓角（足以讓您的div爲圓形）。您也可以使用PIE將此CSS標記在IE 6-8上正常工作。有關更多詳情，請參閱PIE網站。

http://css3pie.com/about/

來源

2011-08-22 17:37:07 dqhendricks

謝謝！我這樣做，它的工作。 – user906357

但是，這裏是我如何獲得用戶圖像。如何將用戶圖像放入div的背景？ <？php $ check_pic =「members/$ id/image01.jpg」; $ default_pic =「members/0/image01.jpg」;如果（file_exists（$ check_pic））{ $ user_pic =「」; } else { $ user_pic =「」; ？ } > ＃apDiv20 {// 這裏是我唯一的猜測/嘗試但失敗了 \t背景圖像：<？PHP $ user_pic; ？>; \t border-radius：189px; \t position：absolute; \t width：378px; \t height：378px; } – user906357

@ user906357你也可以在圖像上做圓角。從未嘗試過。 – dqhendricks

您不必如果你有一個一致的頁面背景實際上編輯圖像。假像這樣...

<div style="width: 50px; height: 50px; background-image: url('path/to/user/image.jpg'); background-position: 0px 0px; background-repeat: no-repeat;"> 
    <img style="margin: 0px; padding: 0px; border: none;" src="path/to/circle/mask.png" alt="" /> 
</div>

你也可以在你的樣式表中加入相當多的標記（清理它）。

來源

2011-08-22 17:38:15 65Fbef05

回答

相關問題