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. docker-compose中volumes的問題2. angular.js - angular內(nèi)容過長展開收起效果3. dockerfile - [docker build image失敗- npm install]4. golang - 用IDE看docker源碼時的小問題5. 表單提交驗證,沒反應(yīng),求老師指點6. mysql函數(shù)unix_timestamp如何處理1970.1.1以前的數(shù)據(jù)?7. Mac下mysql在控制面板中stop按鈕點了沒反應(yīng)8. 老師,樣式?jīng)]有變呀?9. mysql - 記錄開始時間和結(jié)束時間,表字段類型用timestamp還是datetime?10. MySQL 什么需求下(情況下)才使用事務(wù)?

網(wǎng)公網(wǎng)安備