如何在微信小程序中使用css

如何在微信小程序中使用css？相信很多沒有經(jīng)驗(yàn)的人對(duì)此束手無(wú)策，為此本文總結(jié)了問(wèn)題出現(xiàn)的原因和解決方法，通過(guò)這篇文章希望你能解決這個(gè)問(wèn)題。

專注于為中小企業(yè)提供成都網(wǎng)站設(shè)計(jì)、做網(wǎng)站服務(wù),電腦端+手機(jī)端+微信端的三站合一,更高效的管理,為中小企業(yè)烏達(dá)免費(fèi)做網(wǎng)站提供優(yōu)質(zhì)的服務(wù)。我們立足成都，凝聚了一批互聯(lián)網(wǎng)行業(yè)人才，有力地推動(dòng)了成百上千家企業(yè)的穩(wěn)健成長(zhǎng)，幫助中小企業(yè)通過(guò)網(wǎng)站建設(shè)實(shí)現(xiàn)規(guī)模擴(kuò)充和轉(zhuǎ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è)置最高高度..超過(guò)后可以滑動(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隱藏超過(guò)界面的部分

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;

}

看完上述內(nèi)容，你們掌握如何在微信小程序中使用css的方法了嗎？如果還想學(xué)到更多技能或想了解更多相關(guān)內(nèi)容，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道，感謝各位的閱讀！

當(dāng)前題目：如何在微信小程序中使用css
本文鏈接：http://bm7419.com/article18/jdicdp.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供營(yíng)銷型網(wǎng)站建設(shè)、企業(yè)網(wǎng)站制作、面包屑導(dǎo)航、外貿(mào)建站、網(wǎng)站維護(hù)、定制網(wǎng)站

廣告

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請(qǐng)盡快告知，我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如需處理請(qǐng)聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時(shí)需注明來(lái)源： 創(chuàng)新互聯(lián)