css3 - css小三角定位
問題描述
<p>文字<span class='triangle-down'></span></p>
.triangle-down { width: 0; height: 0; border-left: 0.4rem solid transparent; border-right: 0.4rem solid transparent; border-top: 0.6rem solid darkgray;}
怎么把小三角的位置調(diào)整到文字后面
問題解答
回答1:<html lang='en'><head> <meta charset='UTF-8'> <title>Title</title> <style>p:after { content: ''; display: inline-block; width: 0; height: 0; border-left: 0.4rem solid transparent; border-right: 0.4rem solid transparent; border-top: 0.6rem solid darkgray;} </style></head><body><p>文字</p></body></html>回答2:
用偽元素:after
<p>文字</p>p:after { content: ''; display: inline-block; width: 0; height: 0; border-left: 0.4rem solid transparent; border-right: 0.4rem solid transparent; border-top: 0.6rem solid darkgray;}回答3:
position:absolute;right:0; top:0;文字元素的樣式記得加position:relative
相關(guān)文章:
1. mysql - 表名稱前綴到底有啥用?2. 哭遼 求大佬解答 控制器的join方法怎么轉(zhuǎn)模型方法3. 在mybatis使用mysql的ON DUPLICATE KEY UPDATE語法實(shí)現(xiàn)存在即更新應(yīng)該使用哪個(gè)標(biāo)簽?4. sql語句 - 如何在mysql中批量添加用戶?5. mysql - 數(shù)據(jù)庫表中,兩個(gè)表互為外鍵參考如何解決6. 編輯成功不顯示彈窗7. tp 6.0 數(shù)據(jù)查詢,求教!8. 為什么php修改數(shù)據(jù)無法同步到數(shù)據(jù)庫,只是當(dāng)前頁面修改成功?9. mysql儲存json錯(cuò)誤10. 怎么php怎么通過數(shù)組顯示sql查詢結(jié)果呢,查詢結(jié)果有多條,如圖。
