微信小程序 css使用技巧總結
更新時間：2017年01月09日 11:44:45 投稿：lqh
這篇文章主要介紹了微信小程序 css使用技巧總結的相關資料,需要的朋友可以參考下
微信小程序 css使用技巧
1:用純CSS創(chuàng)建一個三角形的原理把上、左、右三條邊隱藏掉（顏色設為 transparent）
.demo {
width: 0;
height: 0;
border-width: 20px;
border-style: solid;
border-color: transparent transparent red transparent;
}
2:設置最高高度..超過后可以滑動
max-height: 550rpx; overflow-y: scroll;
3: text-overflow 當屬性規(guī)定當文本溢出包含元素時發(fā)生的事情
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 ，(這一句我沒有加同樣實現(xiàn)了效果)另外父元素position:relative
6:強制不換行
white-space:nowrap;
自動換行
div{
word-wrap: break-word;
word-break: normal;
}
強制英文單詞斷行
div{
word-break:break-all;
}
感謝閱讀，希望能幫助到大家，謝謝大家對本站的支持！
相關文章
因為功能需要,需要動態(tài)創(chuàng)建DIV2008-09-09
這篇文章主要介紹了JavaScript中Cookie的使用之如何設置失效時間問題，具有很好的參考價值，希望對大家有所幫助。2022-12-12
在學習JavaScript中的繼承機制時,我們常常會遇到原型和原型鏈這兩個概念,在初學階段,不理解這些概念很容易陷入迷茫,甚至會導致學習 JS 的路程變得曲折,本文將介紹JavaScript原型和原型鏈的概念、設計思想以及相關的使用方法,需要的朋友可以參考下2023-07-07![[JS]點出統(tǒng)計器](http://img.jbzj.com/images/xgimg/bcimg3.png)
[JS]點出統(tǒng)計器...2006-07-07
基于JS定義回車事件的實現(xiàn)代碼，需要的朋友可以參考下2013-07-07
TypeScript中type和interface的區(qū)別及注意事項
type的類型別用可以用戶其他的類型,比如聯(lián)合類型、元祖類型、基本類型,interface不行,下面這篇文章主要給大家介紹了關于TypeScript中type和interface的區(qū)別及注意事項的相關資料,需要的朋友可以參考下2022-10-10
這篇文章主要介紹了使用原生js實現(xiàn)拖拽和粘貼上傳圖片功能,Vue/Rect?生態(tài)用多了都快忘記原生js怎么寫了,今天需要直接在服務器裸寫個頁面,實現(xiàn)?textarea?文本框里接收拖拽多個圖片,需要的朋友可以參考下2024-04-04
這篇文章主要為大家介紹了使用SpreadJS快速清除Excel中工作表保護密碼方法詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪2023-11-11
js location.replace與location.reload的區(qū)別
js location.replace與location.reload的區(qū)別，經(jīng)常能用的到，需要的朋友可以可以下。2010-09-09
本文給大家分享的是javascript通過setTimeout實現(xiàn)延時顯示提示框的特效代碼，效果非常棒，這里推薦給大家2016-04-04