-
Notifications
You must be signed in to change notification settings - Fork 41
Getting Started
The Skeleton Framework strives to be minimalist and mobile first. While functional, it really shines when used as a structural underpinning (like a skeleton, eh?) for your own project.
This is all you need to get started building your own awesome stuff with Skeleton Framework.
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<title> A Fancy New Project With Skeleton </title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="css/normalize.css">
<link rel="stylesheet" href="css/skeleton.css">
<link rel="stylesheet" href="css/main.css">
</head>
<body>
<!-- ... -->
</body>
</html>Of particular note is this line
<meta name="viewport" content="width=device-width, initial-scale=1">And these
<link rel="stylesheet" href="css/normalize.css">
<link rel="stylesheet" href="css/skeleton.css">
<link rel="stylesheet" href="css/main.css">Normalize is recommended as it creates a clean slate for Skeleton Framework and your CSS. Pick up the latest version of Normalize here
Skeleton Framework's grid system is proportioned to the root font-size of the
document, respecting the browser's default out of the box. If you'd like to
scale things up or down, be sure to set your own font-size on your html
element.
Further, Skeleton Framework sets a root font-color on the body, so that would
be another thing worth overriding if need be.
Check out the Grid System, then learn about Skeleton Framework's Utility Classes.
The Skeleton Framework touches a number of other elements without using custom classes, as explained in Everything Else.
If you need to create a customized version of Skeleton Framework, check out Roll Your Own.
Skeleton Framework offers a minimal However, if you need more fuctionality, it is easy to couple Skeleton Framework with the lovely HTML5 Boiler Plate.