3
Q
CSS圓形面具
A
回答
6
您可以使用overflow:hidden;
:
更改您CSS:添加overflow:hidden;
和text-align:center
到
#profile-pic {
\t position: absolute;
\t z-index: 999;
\t width: 200px;
\t height: 200px;
\t left: 33px;
\t background: #FFF;
\t border: 3px solid #FFF;
\t border-radius: 100px;
\t -webkit-border-radius: 100px;
\t -moz-border-radius: 100px;
\t top: 0px;
\t position: relative;
background:red;
overflow:hidden;
text-align:center;
}
.profile-btn-bg{
\t position: absolute;
\t background-color: black;
\t width: 100%;
\t height: 30%;
\t bottom: 0px;
}
a.profile-pic-btn{
\t color: #fff;
}
<div id="profile-pic-wrap">
<div id="profile-pic">
<div class="profile-btn-bg">
<a href="#" class="profile-pic-btn">Change Profile</a>
</div>
</div>
</div>
1
相關問題
- 1. 圖像圓形面具,Flash動作3
- 2. Css圓形圖像
- 3. 具有圓形邊框(不是角落)的CSS三角形
- 4. CSS或jQuery/JavaScript橢圓形/圓形方形進度條
- 5. 倒圓形的邊框css
- 6. GTK和CSS:圓形按鈕
- 7. CSS定義形狀橢圓
- 8. css圓形裝載機
- 9. 圓形進度條(css)
- 10. CSS圓形裁剪矩形圖像
- 11. css border-radius圓形變爲橢圓形,位置:絕對
- 12. 圓形面板的標記?
- 13. 圓形頁面轉換
- 14. FLASH動作圓角面具?
- 15. 具有圓邊的面板
- 16. InkCanvas表面可以是圓形/橢圓形狀嗎?
- 17. 通過raphael js的圓形圖像面具?
- 18. 使用CSS/CSS3的圓形段
- 19. 按鈕沒有出現圓形的CSS
- 20. 用CSS只顯示圓形指示器
- 21. CSS:將three.js放在圓形div中?
- 22. 圓形按鈕CSS加載動畫
- 23. CSS圓形邊框填充動畫
- 24. 任何尺寸的CSS圓形圖像
- 25. 用純CSS繪製超橢圓形
- 26. CSS - 圓形選擇,複選框和Radiobutton
- 27. 在目標C中,我們如何模擬圓形/圓形形狀的面?
- 28. Box2D的矩形體具有圓角
- 29. libx中的GDX具有圓形覆蓋
- 30. CSS - 如何在圓形圖像周圍添加圓形邊框/輪廓?
把它放在圓圈內有'溢出:hidden'紅圈? – 2014-09-23 09:53:58