隨意設(shè)置字體粗細(xì),不局限于小程序
在小程序或者其它地方使用font-weight
時(shí)(情景了解
)
- font-weight: 設(shè)置文本字體的粗細(xì)。取值范圍為100-900
- normal: 默認(rèn)值相當(dāng)于400、bold: 粗體相當(dāng)于 700
然而在實(shí)際的過程中,我設(shè)置100-900
的時(shí)候
- 100~300: 顯示為細(xì)
- 400~500:為默認(rèn)值
- 600~900: 顯示為粗體
當(dāng)我們想娶一個(gè)理想的值時(shí),表示很頭疼
使用-webkit-text-stroke-width
定義文字描邊的厚度(重點(diǎn)
)
wxml
文件
<view class="lighter">字體的粗細(xì)情況(細(xì)體100~300)</view>
<view class="normal">字體的粗細(xì)情況(默認(rèn)400~500)</view>
<view class="bold">字體的粗細(xì)情況(加粗600~900)</view>
<view class="a1">字體的粗細(xì)情況(0.1px)</view>
<view class="a2">字體的粗細(xì)情況(0.2px)</view>
<view class="a3">字體的粗細(xì)情況(0.3px)</view>
<view class="a4">字體的粗細(xì)情況(0.4px)</view>
<view class="a5">字體的粗細(xì)情況(0.5px)</view>
<view class="a6">字體的粗細(xì)情況(0.6px)</view>
<view class="a7">字體的粗細(xì)情況(0.7px)</view>
<view class="a8">字體的粗細(xì)情況(0.8px)</view>
<view class="a9">字體的粗細(xì)情況(0.9px)</view>
wxss
文件
.a1{
-webkit-text-stroke-width: 0.1px
}
.a2{
-webkit-text-stroke-width: 0.2px
}
.a3{
-webkit-text-stroke-width: 0.3px
}
.a4{
-webkit-text-stroke-width: 0.4px
}
.a5{
-webkit-text-stroke-width: 0.5px
}
.a6{
-webkit-text-stroke-width: 0.6px
}
.a7{
-webkit-text-stroke-width: 0.7px
}
.a8{
-webkit-text-stroke-width: 0.8px
}
.a9{
-webkit-text-stroke-width: 0.9px
}
雖然可以實(shí)現(xiàn)字體的隨意加粗,但顯示出來的字體可以不夠清晰,故這不是理想的實(shí)現(xiàn)方式,不過這不為是一種是最簡(jiǎn)單的一種字體加粗方式文章來源:http://www.zghlxwxcb.cn/news/detail-501416.html
如果對(duì)你有所不一樣的認(rèn)知提升是否可以留下一點(diǎn)你來過的痕跡文章來源地址http://www.zghlxwxcb.cn/news/detail-501416.html
到了這里,關(guān)于小程序隨意設(shè)置字體粗細(xì)(一行代碼)的文章就介紹完了。如果您還想了解更多內(nèi)容,請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章,希望大家以后多多支持TOY模板網(wǎng)!