intel app框架集中内容

时间:2014-03-12 13:44:06

标签: appframework

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

我如何通过英特尔应用框架UI实现这一目标。

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

1 个答案:

答案 0 :(得分: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