用于 Web 应用的 HTML5 / CSS3 模板 [关闭]答案

【问题标题】：HTML5 / CSS3 template for web app [closed]用于 Web 应用的 HTML5 / CSS3 模板 [关闭]
【发布时间】：2011-06-17 18:03:01
【问题描述】：

我正在寻找一个漂亮的 Web 应用布局（模板），最好是 HTML5/CSS3，最好是下图所示的布局。如果这是不可能的，那么可以轻松地将布局更改为如下布局：

我（当然）花了很多时间来看看我是否可以自己找到它/谷歌它，但除了 Themeforest 之类的东西之外，没有找到太多其他东西 - 并且在那里找不到合适的东西。

我准备好在它上面花很多钱了，所以找到合适的东西比价格更重要。

项目开始是星期一，所以我不能去设计机构，因为那会花费很长时间，所以基本上我需要一个付费或免费的模板，我们可以稍后定制。

一个简单的布局就足够了，但是一个设计漂亮、样式漂亮的表单、按钮等的布局会更好。

任何关于在哪里找到它的帮助将不胜感激:)

【问题讨论】：

您是在寻求布局方面的帮助还是有人为您制作布局？
他正在寻找一个预制的、已经编码的设计。
大家好。感谢您的回复。 reisio 是对的，我正在寻找已经编码的设计。

标签： templates web-applications html css

【解决方案1】：

简单易懂的日语 :) 无论如何，如果你想要一个完整的 css3 布局，你应该看看 this implementation

<!DOCTYPE html>

<html>
 <head>
  <meta charset = "utf-8">

  <title></title>

  <style>
   #content {
    float: left;
    height: 70%;
    width: 80%;
   }

   #menu {
    float: left;
    height: 70%;
    width: 20%;
   }

   #footer {
    clear: left;
    height: 15%;
   }

   #header {
    height: 15%;
   }

   body {
    position:absolute;
    bottom: 0;
    left: 0;
    right: 0;
    top: 0;
   }

   body > div {
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -webkit-box-sizing: border-box;

    border: 3px solid red;
    border-radius: 20px;
    box-bozing: border-box;
    padding: 10px;
   }

   input {
    background-color: rgba(255, 255, 255, 1);
    border: 2px solid red;
    border-radius: 15px;
    padding: 7px;
   }

   input:hover {
    background-color: rgba(250, 250, 247, 1);
   }
  </style>
 </head>

 <body>
  <div id = "header">Header</div>
  <div id = "menu">Menu</div>
  <div id = "content">Content</div>
  <div id = "footer">Footer</div>
 </body>
</html>

预览

【讨论】：

非常感谢你 2x2p1p。欣赏它！我不是超级 CSS 鲨鱼——你粘贴的代码是 CSS2 还是 CSS3？如果是后者，除非我找到更多设计的东西，否则我肯定会使用您的代码 - 即。就像我写的那样，带有设计好的按钮、设计精美/样式精美的表单字段等。您（或其他任何人）是否拥有完整的模板（或模板的链接）？谢谢:-)
哇我误会了，代码只是首页。 CSS很简单，你可以处理。我会再帮你处理表格的。
再次感谢，2x2p1p :-)

【解决方案2】：

现场演示： http://jsfiddle.net/xJE53/1/

（我使用 min-height 来模拟填充内容的主要区域）

【讨论】：

Šime，非常感谢您编写代码。是 CSS2 还是 3？再次感谢:)
@rassom 除了overflow-y 之外的所有属性都是CSS2。请注意，IE6 到 IE8 对 CSS2 的支持有限，因此您必须检查其在这些浏览器中的外观。（我这里只有IE9，所以没办法帮你查）
好的，非常感谢 Šime。感谢您花时间提供帮助:-)

【解决方案3】：

52Framework 呢？

【讨论】：

谢谢，克努。我确实看过 52Framework，虽然它确实包含一些不错的东西，但它并没有我想要的图形布局。