這篇“CSS中怎么制作左上朝向三角形”文章的知識點(diǎn)大部分人都不太理解,所以小編給大家總結(jié)了以下內(nèi)容,內(nèi)容詳細(xì),步驟清晰,具有一定的借鑒價(jià)值,希望大家閱讀完這篇文章能有所收獲,下面我們一起來看看這篇“CSS中怎么制作左上朝向三角形”文章吧。
成都創(chuàng)新互聯(lián)公司專業(yè)為企業(yè)提供市中網(wǎng)站建設(shè)、市中做網(wǎng)站、市中網(wǎng)站設(shè)計(jì)、市中網(wǎng)站制作等企業(yè)網(wǎng)站建設(shè)、網(wǎng)頁設(shè)計(jì)與制作、市中企業(yè)網(wǎng)站模板建站服務(wù),10余年市中做網(wǎng)站經(jīng)驗(yàn),不只是建網(wǎng)站,更提供有價(jià)值的思路和整體網(wǎng)絡(luò)服務(wù)。
示意圖(以寬高各60px為例):
這種三角形,一般可以用來做“對話框”類型圖形的左下小腳。
第一種:
#triangle-topleft { border: 30px solid #e6686e; height: 0; width: 0; border-right-color: transparent; border-bottom-color: transparent; }
第二種:
#triangle-topleft { width: 0; height: 0; border-top: 60px solid #e6686e; border-right: 60px solid transparent; }
第三種:
#triangle-topleft { border: 60px solid transparent; width: 0; height: 0; border-left-color: #e6686e; border-top-width: 0; }
以上就是關(guān)于“CSS中怎么制作左上朝向三角形”這篇文章的內(nèi)容,相信大家都有了一定的了解,希望小編分享的內(nèi)容對大家有幫助,若想了解更多相關(guān)的知識內(nèi)容,請關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道。
本文標(biāo)題:CSS中怎么制作左上朝向三角形
本文來源:http://muchs.cn/article10/jpijdo.html
成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供網(wǎng)站收錄、電子商務(wù)、網(wǎng)站維護(hù)、定制網(wǎng)站、網(wǎng)站改版、標(biāo)簽優(yōu)化
聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請盡快告知,我們將會在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場,如需處理請聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來源: 創(chuàng)新互聯(lián)