Download configuration of amazeui and implementation of HelloWorld

Time:2020-10-29

Although this thing is known as cross platform browser support, it is recommended not to use this front-end framework to develop PC side web pages, because it does not support browsers below IE8. If the PC is not compatible with IE6, it can be discarded. Amazeui is good only for mobile web pages. Its HTML5 features are in line with the characteristics of mobile browsers. Don’t try to write a web page that is compatible with both PC and mobile phone. It should be arranged separately. Don’t you see that there is a “mobile version” and a “computer version” at the bottom of many mobile pages?

1. This item can be downloaded directly from the official website of amazeui (click the open link). After opening the official website, select “start using” – > and then “amaze UI v2.3.0” in the “get amaze UI” column

 

2. After downloading, unzip and drag the assets to your mobile site directory.

3. Create a new one Helloworld.html Your site directory should look like this:

4. In Helloworld.html Write the following code, and then use Google browser, wild fox Zen and other browsers that support mobile page debugging, open Helloworld.html The following pages are compared with those of the official website Helloworld.html For example, delete many meaningless external file references.

<! -- develop with HTML5 -- >
<!doctype html>
<html class="no-js">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <! -- automatically adapt to mobile screen -- >
        <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
        <! -- give priority to WebKit kernel rendering -- >
        <meta name="renderer" content="webkit">
        <! -- don't be transcoded by Baidu -- >
        <meta http-equiv="Cache-Control" content="no-siteapp"/>
        <! -- the following is the introduction of amazeui resources -- >
        <link rel="stylesheet" href="assets/css/amazeui.min.css">
        <link rel="stylesheet" href="assets/css/app.css">
        <script src="assets/js/jquery.min.js"></script>
        <title>Hello Amaze UI</title>
    </head>
	<body>
    	<h1>Hello Amaze UI.</h1>
        < button type = "button" class = "am BTN am BTN default" > default style < / button >
        < button type = "button" class = "am BTN am BTN primary" > main color button < / button >
        < button type = "button" class = "am BTN am BTN secondary" > sub color button < / button >
        < button type = "button" class = "am BTN am BTN success" > green button < / button >
        < button type = button "class =" am BTN am BTN am BTN warning "> Orange Button < / button >
        < button type = "button" class = "am BTN am BTN danger" > red button < / button >
        < button type = "button" class = "am BTN am BTN danger am round" > red button with rounded corners
		< a class = "am BTN am BTN link" > link</a>
	</body>
</html>

The results are as follows:

This article on the amazeui download configuration and HelloWorld implementation of the article introduced here, more related amazeui download configuration content, please search the previous articles of developeppaer or continue to browse the related articles below, I hope you will support developeppaer more in the future!

Recommended Today

HTML5 localstorage Usage Summary

1、 What is localstorage, sessionstorage In HTML5, a new local storage feature is added. This feature is mainly used as local storage to solve the problem of insufficient cookie storage space (the storage space of each cookie in the cookie is 4K). In the local storage, the general browser supports 5m size, which will be […]