How to use the definition of Ali Fonts icon theme color of the applet control in the home page styles using components is centered horizontally and vertically centered way of H5 on the back line,

Project to build

1 ==> files needed to create the folder

Public styles styles storage
components storage component
lib third-party libraries
utils own help library
reques own interface

2 == "How to quickly create pages

Page path in app.json written in. Saved directly, it will automatically generate the file
"Pages and the / good_lis / good_lis",
"Pages and the / the Cart / the Cart"

3 == "How to Use the Fonts icon Ali

The URL (generated http://at.alicdn.com/t/font_1576796_281fgtvnbhl.css) opens in the browser,
then copy the code into the file is not under iconfont.wxss styles iconfont.wxss To create a new Kazakhstan

In app.wxss introduced
@import "./styles/iconfont.wxss";

Use the following

Note that there must be iconfont

I think we can also use online direct address does not need to copy down the contents of the online address

4 === "tabBar you build structures have been here before you step in the build

5 == "clear the default style

Page, View, text, Swiper, Swiper-Item, Image, {Navigator
padding: 0;
margin: 0;
Box-Sizing: border-Box;
}
Since the applet does not support
the * wildcard

6 color == "how to define the subject matter in the micro-letter

Color theme is controlled by variable

The subject matter defined in the color app.wxss
Page {
--theneColor: # eb4450;
}

Usethemcolor is used in XXX.wxss your class definition
.usethemcolor {
Color: var (- theneColor);
}

7 == "in the app.wxss

Font size uniform definition
Page {
/ * = 2rpx 1px 2px = 28rpx * /
font-size: 28rpx;
}

8 == "control heading home style

"window": {
"backgroundTextStyle": "Light", // Font
"navigationBarBackgroundColor": "# eb4450" , // background color
"navigationBarTitleText": "Happy Shopping", // Text
"navigationBarTextStyle": "Black"
} ,

09 == "How to Use component

Creating components
When you put the components created,
in the path app.json there will be corresponding components Kazakhstan as follows:
"Components / searchinput / searchinput"

In reference to a page in the assembly
XXX.json configure what key: value of the form

"usingComponents": {
"searchinput":"../../components/searchinput/searchinput"
}

use

Use 10 == "shortcuts

view.viewbox carriage return

11 == "is centered horizontally and vertically centered way H5 (important Ha)

height: 100%;
the display: Flex;
The justify-Content: Center; / horizontal center /
align = left-items: Center; / vertical centering /

12 == "component search box

<view class="search_input">
  <!-- navigator 必须要有url  open-Type="navigator"跳转到非tarBar页面 -->
  <navigator class="navigator_input" url="/pages/search/search" open-Type="navigator">
    搜索
  </navigator>
</view>

/ * Search box pattern * /
.search_input {
height: 90rpx;
padding: 10rpx;
background: var (- theneColor);
}

{.navigator_input .search_input
height: 100%;
the display: Flex;
The justify-Content: Center;
/ horizontal center /
align = left-items: Center;
/ vertical centering /
background-Color: #fff;
border-RADIUS: 14rpx;
}

13 ==> About on the line,

wx.requese the url requirements
1) must be the beginning of HTTPS
2) to add the domain name to the background of the applet
you want to log in === "Development set developed (with map)

Guess you like

Origin www.cnblogs.com/IwishIcould/p/12081515.html