Home  >  Article  >  WeChat Applet  >  How to reduce the icon size in WeChat mini program

How to reduce the icon size in WeChat mini program

angryTom
angryTomOriginal
2020-03-23 09:55:2210085browse

How to reduce the icon size in WeChat mini program

How to reduce the icon size in the WeChat mini program

The icon in the WeChat mini program uses the icon component, and the attribute values ​​​​are type, size, and color. The size attribute controls the size of the icon. If you want to shrink the icon, you only need to set the size value smaller.

Recommended learning: Small program development

The icon component parameters are as follows:

##typeStringType of icon, valid values: success, success_no_circle, info, warn, waiting, cancel, download, search, clearsizeNumber 23The size of the icon in pxcolorColor## Reference code:
Attribute nameTypeDefault valueDescription
## The color of #icon is the same as the color of css
1, wxml


  
    
  



  
    
  




  
    
  

2, js

Page({
  data: {
    iconSize: [20, 30, 40, 50, 60, 70],
    iconColor: [
      'red', 'orange', 'yellow', 'green', 'rgb(0,255,255)', 'blue', 'purple'
    ],
    iconType: [
      'success', 'success_no_circle', 'info', 'warn', 'waiting', 'cancel', 'download', 'search', 'clear'
    ]
  }
})

3. Rendering:

PHP Chinese website, a large number of How to reduce the icon size in WeChat mini programjquery video tutorials

, welcome to learn!

The above is the detailed content of How to reduce the icon size in WeChat mini program. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn