code: function styleBlockHandler(element) {
      const {property, value} = element
      let result = []
      const styleContent = value && value.children ? value.children : []
      const defaultUnit = "px"
      styleContent.forEach(e => {
          switch (e.type) {
              case "Identifier":
                  result.push(e.name);
                  break
              case "Dimension":
                  result.push(e.value + defaultUnit);
                  break
              case 'Function': {
                  //function case need '()' container,such as rgb(255,0,0)
                  let name = e.name + "("
                  e.children.forEach(e => name += e.value + queryUnit(e.unit))
                  result.push(name + ")")
                  break
              }
              case "HexColor": {
                  result.push("#" + e.value)
                  break
              }
              case "String": {
                  const str = e.value
                  result.push(str)
                  break
              }
              case "Number": {
                  result.push(e.value)
                  break
              }
              case "Percentage": {
                  result.push(e.value + "%")
                  break
              }
              case "WhiteSpace": {
                  break
              }
              case "Operator": {
                  break
              }
              case "Url": {
                  break
              }
              default:
                  // console.log("unknown,", property, e)
                  break
          }
      })
      //padding modification
      if (result.length > 0)
          return paddingElementForTransform(property, result)
      return []
  }
docs: handle with different node structure in ast
  @param element
  @return {*}