Skip to content

Instantly share code, notes, and snippets.

@L42y

L42y/index.html

Created March 28, 2012 09:22
Show Gist options
  • Save L42y/2225005 to your computer and use it in GitHub Desktop.
Save L42y/2225005 to your computer and use it in GitHub Desktop.
Download ZIP
example
Raw
index.html
<html>
<head>
<title>gist</title>
</head>
<body>
<div class="clearfix">
<div class="l">
<img src="//placehold.it/200"/>
<article class="info">
<header class="clearfix">
<h1 class="l">马龙</h1>
<span class="r">广东 佛山</span>
</header>
<div class="detail">
<p>
bla bla
</p>
</div>
<a class="btn" href="#"></a>
</article>
</div>
<div class="r">
<dl class="clearfix">
<dt>已绑定账号</dt>
<dd>
<a href="#"></a>
</dd>
<dd>
<a href="#"></a>
</dd>
<dd>
<a href="#"></a>
</dd>
<dd>
<a href="#"></a>
</dd>
<dd>
<a href="#"></a>
</dd>
</dl>
</div>
</div>
</body>
</html>
Raw
style.scss
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { *zoom: 1; }
body {
width:960px;
margin:0 auto;
}
.clearfix {
.l {
float: left;
}
.r {
float: right;
}
}
.info {
width: 400px;
position: relative;
margin-left: 220px;
.address {
top: 0;
right: 0;
position: absolute;
}
}
.services {
dd {
float:left;
}
a {
width:44px;
height:44px;
float: left;
display: block;
background:#000;
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment