今天在做網(wǎng)頁窗口的時候遇到了一些問題，因個人的操作問題使三角不能正常的顯示而用！important來使三角正常出現(xiàn)在正確位置上。
下面是我的錯誤操作代碼和網(wǎng)頁顯示圖：

        div dl dd :last-child{
        height: 34px;
        width: 249px;
    }
    div dl dd span i {
        display:inline-block;
        width: 0;
        height: 0;
        border: 4px solid transparent;
        border-left-color: black;
    }
<div>
    <dl>
        <dt><img src="../imge/二手車.png" alt=""></dt>
        <dd>
            <span>小戶型</span>
            <span>精裝兩居</span>
            <span>小三居</span>
            <span>準(zhǔn)新房</span>
            <span>精裝修</span>
            <span>南北通透</span>
            <span>低總價</span>
            <span>帶電梯</span>
            <span>別墅</span>
            <span>全部二手房源<i></i></span>
        </dd>
    </dl>
</div>

顯示圖為：

微信截圖_20190628201712.png

在這個圖片中可以看出三角顯示不出來，我當(dāng)時檢查的時候看著好像是高度不夠，于是我在這個問題上鉆牛角筋了一節(jié)課也沒有發(fā)現(xiàn)問題出現(xiàn)在哪里。。。。
然后我就用了 ！important 來解決這個問題：

     div dl dd span i {
        display:inline-block;
        width: 0 !important;
        height: 0 !important;
        border: 4px solid transparent;
        border-left-color: black;

顯示圖終于正常了。。。。：

微信截圖_201906282021593333333.png

后來，我在晚上上自習(xí)的時候經(jīng)過老師的檢查，才發(fā)現(xiàn)這個問題的所在，，自己打字留下來的小毛病害了自己啊。
正確的代碼應(yīng)該為：

 div dl dd span:last-child{
        height: 34px;
        width: 249px;
    }
    div dl dd span i {
        display:inline-block;
        width: 0px;
        height: 0px;
        border: 4px solid transparent;
        border-left-color: black;
    }

微信截圖_201906282021593333333.png

哈哈哈，我這個手指啊，總是在敲好代碼后自己多摁一下空格。。。。。讓我頭疼了一節(jié)課，唉！我飄逸的頭發(fā)又要少了好多0.0