首页前端开发HTMLAmazeUI的下载配置与Helloworld的实现

AmazeUI的下载配置与Helloworld的实现

时间2024-01-25 06:18:15发布访客分类HTML浏览629
导读:收集整理的这篇文章主要介绍了AmazeUI的下载配置与Helloworld的实现,觉得挺不错的,现在分享给大家,也给大家做个参考。 虽然这东西号称跨平台支持浏览器,但建议还是不要使用这个前端框架开发PC端的网页,因为这东西不支持i...
收集整理的这篇文章主要介绍了AmazeUI的下载配置与Helloworld的实现,觉得挺不错的,现在分享给大家,也给大家做个参考。

虽然这东西号称跨平台支持浏览器,但建议还是不要使用这个前端框架开发PC端的网页,因为这东西不支持ie8以下的浏览器。在PC上不兼容IE6的话,基本可以抛弃了。amazeUI仅仅用来做移动端的网页还是不错的,其HTML5的特性等很符合手机浏览器的特点。不要妄想能写出一个网页同时兼容PC与手机,应该分开布局。君不见在很多手机版网页的底部有“手机版”与“电脑版”之分吗?

1、这东西直接在AmazeUI的官网(点击打开链接)中下载,打开官网之后,选择“开始使用”-> 然后在“获取 Amaze UI”一栏中“Amaze UI v2.3.0”

 

2、下载之后,之后解压,把里面的assets拖到你手机版的站点目录。

3、新建一个Helloworld.html,你的站点目录应该如下图:

4、在Helloworld.html写入如下的代码,然后使用GOOGLE浏览器、野狐禅等支持手机版网页调试的浏览器,打开Helloworld.html,以下的网页对比与官网的Helloworld.html例子,删除不少的没意义的外部文件引用。

!--使用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">
            !--自动适应移动屏幕-->
            meta name="viewport" content="width=device-width, inITial-scale=1, maximum-scale=1, user-scalable=no">
            !--优先使用webkit内核渲染-->
            meta name="renderer" content="webkit">
            !--不要被百度转码-->
            meta http-equiv="Cache-Control" content="no-siteapp"/>
            !--以下才是引入amazeui资源-->
            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">
    默认样式/button>
            button type="button" class="am-btn am-btn-Primary">
    主色按钮/button>
            button type="button" class="am-btn am-btn-secondary">
    次色按钮/button>
            button type="button" class="am-btn am-btn-success">
    绿色按钮/button>
            button type="button" class="am-btn am-btn-warning">
    橙色按钮/button>
            button type="button" class="am-btn am-btn-danger">
    红色按钮/button>
            button type="button" class="am-btn am-btn-danger am-round">
    圆角红色按钮/button>
    		a class="am-btn am-btn-link">
    链接/a>
    	/body>
    /html>
    

则得到如下的效果:

到此这篇关于AmazeUI的下载配置与Helloworld的实现的文章就介绍到这了,更多相关AmazeUI下载配置内容请搜索以前的文章或继续浏览下面的相关文章,希望大家以后多多支持!

声明:本文内容由网友自发贡献,本站不承担相应法律责任。对本内容有异议或投诉,请联系2913721942#qq.com核实处理,我们将尽快回复您,谢谢合作!

AmazeUI下载配置"

若转载请注明出处: AmazeUI的下载配置与Helloworld的实现
本文地址: https://pptw.com/jishu/586215.html
AmazeUI 手机版页面的顶部导航条Header与侧边导航栏offCanvas的示例代码 Ratchet 模态框的实现

游客 回复需填写必要信息