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