当前位置: 首页 > 科技观察

HarmonyOSCss样式与普通HTMLCss样式的区别

时间:2023-03-15 01:36:39 科技观察

更多信息请访问:华为共建HarmonyOS技术社区https://ost.51cto.com前言时间过得真快,不知不觉从事鸿蒙开发已经半年多了。记得刚进公司的时候,连DevEcoStudio这个开发者工具环境都装不上。它是由我的同事安装的。走向一个是一个艰苦的过程,你会在实践中不断成长。言归正传,进入今天的主题。对显示属性的支持是不同的。鸿蒙CSS支持的属性有:普通CSS支持的属性有:对于伪类选择器和伪元素选择器,鸿蒙CSS不支持伪类选择器和伪元素选择器。PlainCSS支持伪类选择器和伪元素选择器。宽度和高度支持的值不一样。鸿蒙目前支持宽高的px和百分比。常用的css支持px、em、rem、percentage、vw、vh、vm。边距居中就不一样了。对于经常写css的我们来说,剧中最简单的写法就是margin:0auto,但是鸿蒙不支持这种写法。对边框属性的支持不尽相同。使用border设置属性时,HarmonyOS必须按照指定的顺序写入(即使用简写属性设置所有的border属性,包括borderwidth、style、color属性,顺序设置为border-width、border-style,border-color,不设置时,各属性值为默认值。)border-style:HarmonyOS支持以下三种类型:dotted:显示为一系列圆点,圆点的半径为边框的一半-宽度。虚线:显示为一系列短虚线。solid:显示为实线。通用css支持以下属性:dotted-定义虚线边框。dashed-定义虚线边框。solid-定义实心边框。双-定义双边框。groove-定义3D凹槽边界。效果取决于边框颜色值。ridge-定义3D脊线边界。效果取决于边框颜色值。插图-定义3D插图边框。效果取决于边框颜色值。outset-定义3Doutset边框。效果取决于边框颜色值。none-定义无边框。hidden-定义隐藏边框。border-width:normalcsssupport可以将宽度设置为特定大小(单位为px、pt、cm、em),或者使用以下三个预定义值之一:thin、medium或thick,HarmonyOS支持px。border-radius:常见的CSS支持三种类型的值:px、%、em。HarmonyOScss支持px。对背景渐变的支持不尽相同。鸿蒙CSS支持线性渐变/重复线性渐变。普通css支持线性渐变(LinearGradients)和径向渐变(RadialGradients)。鸿蒙独有的一些属性是鸿蒙独有的,而不是常见的CSS。注意事项目前鸿蒙代码使用最多的布局是flex布局。如果需要换行布局,请务必添加flex-direction:column;属性。综上所述,我感觉鸿蒙的布局和标签与微信小程序类似,但又不完全相同。鸿蒙的生态更强大,但由于发布时间不长,很多开发者还在观望和学习中。它越来越强大,越来越多的开发者加入这个阵营。更多信息请访问:与华为官方共建的鸿蒙技术社区https://ost.51cto.com