1

我想用屏幕底部的按钮和一些居中的内容创建一个非常简单的布局。

如何使用英特尔应用程序框架 UI 实现这一目标。

当然，我需要支持所有屏幕尺寸。

4

1 回答 1

1

这是英特尔应用程序框架中的示例：http: //jsbin.com/valuc/1/edit

<!DOCTYPE html>
<html>
<head>
    <title>App Framework</title>
    <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=0;" />

    <link rel="stylesheet" type="text/css" href="http://cdn.app-framework-software.intel.com/2.0/af.ui.css" />
    <link rel="stylesheet" type="text/css" href="http://cdn.app-framework-software.intel.com/2.0/icons.css" />
    <script type="text/javascript" charset="utf-8" src="http://cdn.app-framework-software.intel.com/2.0/appframework.ui.min.js"></script>
    <style>
#page1 {text-align: center}    
    </style>    
</head>
<body> 
<div id="afui">
    <div id="content" style="">
        <div class="panel" title="Welcome" id="page1" selected="true">
            <p>This is come content</p>
            <p>This text is centered in the panel</p>
        </div>
    </div>
    <div id="navbar">
        <a class="icon home" href="#button1">Button 1</a>
        <a class="icon settings" href="#button2">Button 2</a>
    </div>    
</div>
</body>
</html>

您还可以参考一些使用英特尔应用框架创建的基本模板以开始使用：https ://github.com/krisrak/appframework-templates

于 2014-03-12T22:35:22.423 回答