當(dāng)通過把overflow屬性的屬性值設(shè)定為”hidden”的方法,將盒中容納不下的內(nèi)容隱藏起來時,如果使用text-overflow屬性,可以在盒的末尾顯示一個代表省略號”…”。但是,text-overflow屬性只在當(dāng)盒中的內(nèi)容在水平方向上超出盒的容納范圍時有效。例子如下:

電腦培訓(xùn),計算機(jī)培訓(xùn),平面設(shè)計培訓(xùn),網(wǎng)頁設(shè)計培訓(xùn),美工培訓(xùn),Web培訓(xùn),Web前端開發(fā)培訓(xùn)

<!DOCTYPE html><html lang="en"><head>
    <meta charset="UTF-8">
    <title>text-overflow屬性使用示例</title>
    <style>
        div{
            white-space: nowrap;
            width:300px;
            border:solid 1px orange;
            overflow: hidden;
            text-overflow:ellipsis;
        }
    </style></head><body><div>炸彈阿薩德阿薩德 沙雕暗示的薩達(dá)薩達(dá)阿薩德</div></body></html>

電腦培訓(xùn),計算機(jī)培訓(xùn),平面設(shè)計培訓(xùn),網(wǎng)頁設(shè)計培訓(xùn),美工培訓(xùn),Web培訓(xùn),Web前端開發(fā)培訓(xùn)

  • box-shadow屬性的使用方法

在css3中,可以使用box-shadow屬性讓盒在顯示時產(chǎn)生陰影效果。寫法如下:

box-shadow:length length length color

其中,前面三個length分別指陰影離開文字的橫向距離、陰影離開文字的縱向距離