html - css div怎么和它的偽類after共用一樣背景圖片？
問題描述
怎么用p畫出這樣的效果
p怎么和它的偽類after共用一樣背景圖片？能實(shí)現(xiàn)嗎？
問題解答
回答1：css clip可以實(shí)現(xiàn)
clip-path: polygon(0% 0%, 100% 0%, 100% 75%, 75% 75%, 75% 100%, 50% 75%, 0% 75%);
http://bennettfeely.com/clippy/
回答2：確實(shí)需要點(diǎn)小trick,寫了一個(gè)看看如何代碼如下：
<body><p class='main'></p></body>
.main { position: relative; width: 412px; height: 261px; background:url(’http://pic.baike.soso.com/p/20130828/20130828162541-2121279471.jpg’) no-repeat; border-radius: 10px;}.main:after { position: absolute; top: 261px; left: 20px; width: 20px; height: 20px; content: ’’; box-sizing: border-box; border-top: 20px solid transparent; border-left: 20px solid #f3f5f6; border-right: 20px solid #f3f5f6; background: inherit; background-position: -20px bottom; background-origin: border-box; }
https://jsfiddle.net/ycwalker...
回答3：1、可以畫三角形2、可以這樣：把背景色換為你需要的圖片，注意色差！.d1{
position: relative;border: 1px dashed #999;background: #fff;width: 150px;height: 100px;
}
.d1 span{
display: block;width: 20px;height: 20px;position: absolute;border-right:1px dashed #999;border-bottom:1px dashed #999;transform: rotate(45deg);bottom: -10px;left: 50%;margin-left:-15px;background: #fff;z-index: 99;
}3、直接PS扣圖最直接了。
回答4：inherit , inherit 使用繼承。
相關(guān)文章：
1. 關(guān)docker hub上有些鏡像的tag被標(biāo)記““This image has vulnerabilities””2. docker - 各位電腦上有多少個(gè)容器??？容器一多，自己都搞混了，咋辦呢？3. nignx - docker內(nèi)nginx 80端口被占用4. docker容器呢SSH為什么連不通呢？5. mac里的docker如何命令行開啟呢？6. 關(guān)于docker下的nginx壓力測(cè)試7. 如何解決Centos下Docker服務(wù)啟動(dòng)無響應(yīng)，且輸入docker命令無響應(yīng)？8. docker 下面創(chuàng)建的IMAGE 他們的 ID 一樣？這個(gè)是怎么回事？？？？9. docker start -a dockername 老是卡住，什么情況？10. angular.js使用$resource服務(wù)把數(shù)據(jù)存入mongodb的問題。
網(wǎng)公網(wǎng)安備 34170202000408號(hào)-皖I(lǐng)CP備2020019022號(hào)-1 sitemap
Copyright ￠ 2020-2025 Powered by http://www.b3g6.com V1.8 All Rights Reserved 技術(shù)支持：好吧啦網(wǎng)