陈斌彬的技术博客

Stay foolish,stay hungry

Metro UI CSS 3.0

The front-end framework for developing projects on the web in Windows Metro Style

Whats new in 3.0

  1. compatible with AngularJS
  2. full code refactoring & new components
  3. declarative approach to the definition of components
  4. framework itself monitors components, pressure via ajax
  5. create cool page without knowledge of javascript
  6. support classic approach to definition of components

Simple steps to create cool pages

1.Create page with HTML5 DOCTYPE

<!DOCTYPE html>

2.Include required styles and libs

<!DOCTYPE html>
<html>
<head>
    <link href="metro.css" rel="stylesheet">
    <script src="jquery.js"></script>
    <script src="metro.js"></script>
</head>
</html>

3.Use declarative style to create components

<!DOCTYPE html>
<html>
<head>
    <link href="metro.css" rel="stylesheet">
    <script src="jquery.js"></script>
    <script src="metro.js"></script>
</head>
<body>
    <h1>Hello world!</h1>
    <div class="countdown" data-role="countdown" data-days="2"></div>
</body>
</html>