微信小程式中css的提示總結

這篇文章介紹了最近很火的小程式中css的提示總結，有需要的同學可以參考一下本文

小程式 css提示

1:用純CSS建立一個三角形的原理把上、左、右三條邊隱藏掉（顏色設為 transparent）

.demo { width:0; height:0; border-width:20px; border-style:solid; border-color:transparenttransparentredtransparent; }

2:設定最高高度..超過後可以滑動

max-height:550rpx; overflow-y:scroll;

3: text-overflow 當屬性規定當文本溢出包含元素時發生的事情

clip: 修剪文本 ellipsis : 用省略符號來代表被修剪的文字 string: 使用給定的字串來代表被修剪的文字 重點是三個同時使用：text-overflow:ellipsis;white-space:nowrap;overflow:hidden;

4:overflow: hidden當強制不換行的時候,使用overflow:hidden隱藏超過介面的部分

5: margin-bottom失效

margin-bottom是下方的外邊距，並不能讓元素向下方移動，margin-top作為上邊距，把元素“推”了下去。 希望表徵圖距離下方30px，那麼可以在ul上設定position:absolute,bottom:30px，(這一句我沒有加同樣實現了效果)另外父元素position:relative

6:強制不換行

white-space:nowrap;

自動換行

p{ word-wrap: break-word; word-break:normal; }

強制英文單詞斷行

p{ word-break:break-all; }