You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
|
|
<!DOCTYPE html> <head> <!-- Standard Meta --> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" /> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
<!-- Site Properities --> <title>Homepage Example - Semantic</title>
<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700|Open+Sans:300italic,400,300,700' rel='stylesheet' type='text/css'>
<link rel="stylesheet" type="text/css" href="../packaged/css/semantic.css"> <link rel="stylesheet" type="text/css" href="homepage.css">
<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery/2.0.3/jquery.js"></script> <script src="../packaged/javascript/semantic.js"></script> <script src="homepage.js"></script>
</head> <body id="home"> <div class="inverted fixed ui menu"> <div class="borderless item"><b>The Cat Foundation</b></div> <div class="right menu"> <a class="item">Courses</a> <a class="item">Library</a> <a class="item">BBS</a> </div> </div> <div class="ui inverted orange page grid masthead segment"> <div class="column"> <img src="images/cat.png" class="ui medium image"> <div class="information"> <h1 class="ui inverted header"> Learn more about your Cat </h1> <p>An introduction to living with cats. The most interesting species on earth!</p> <div class="large black animated fade ui button"> <div class="visible content">Seminar November 15th</div> <div class="hidden content">Buy Tickets</div> </div> </div> </div> </div> <div class="ui page grid overview segment"> <div class="twelve wide column"> <div class="ui three column center aligned stackable divided grid"> <div class="column"> <div class="ui icon header"> <i class="circular book icon"></i> Courses </div> <p>Get you and your team up and running with our online training courses. We think they’re pretty awesome.</p> <p><a class="ui right labeled icon button" href="#">Archive<i class="right icon"></i></a></p> </div> <div class="column"> <div class="ui icon header"> <i class="circular code icon"></i> Library </div> <p>Dig through our cat library to found out amazing things you can do with your kitty. <p><a class="ui right labeled icon button" href="#">Cat library<i class="right icon"></i></a></p> </div> <div class="column"> <div class="ui icon header"> <i class="circular user icon"></i> Community </div> <p>Get feedback on your cat from a community of loving pet owners on our online bulletin board system.</p> <p><a class="ui right labeled icon button" href="#">BBS<i class="right icon"></i></a></p> </div> </div> </div> <div class="ui four wide column"> <h4 class="ui top attached header">Things Cats Like</h4> <div class="ui bottom attached segment"> <div class="ui relaxed divided list"> <div class="item"> <div class="header">Yarn</div> <div class="description">This one is a bit self explanatory, you've seen cartoons right?</div> </div> <div class="item"> <div class="header">Other Cats</div> <div class="description">Cats are social creatures, right? I'm pretty sure. At least I think i saw cats play together once before.</div> </div> <div class="item"> <div class="header">Cat Food</div> <div class="description">A cats got to eat. Some cats eat more than others. Everybody loves a good fat cat.</div> </div> </div> </div> </div> </div> <div class="ui page grid feature segment"> <div class="row"> <div class="column"> <h1 class="center aligned ui header"> Cat Tips Right In Your Inbox </h1> </div> </div> <div class="row"> <div class="ten wide column"> <h2 class="ui header">How to Win Your Cats Attention</h2> <p>Getting your cat to notice you is a large part of being a pet owner. Although I have a lot of patience for writing things about cats, perhaps this might be enough body copy to make this section of text look filled out.</p> <p>This and other tips can be found in our newsletter, amazing right?</p> <div class="ui fluid basic button">Read More</div> </div> <div class="six wide column"> <div class="ui secondary segment"> <h3 class="ui header">Sign up for Our Newsletter</h3> <div class="ui form"> <div class="field"> <div class="ui icon input"> <i class="user icon"></i> <input type="text" placeholder="name@email.com"> </div> </div> <div class="ui primary button">Sign up</div> </div> </div> </div> </body>
</html>
|