EMERTAT
دوشنبه 14 فروردین 1391, 13:24 عصر
این با css ساخته بودن :لبخند:
اینم کد هاش
اول فایل html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title></title>
<link rel="stylesheet" type="text/css" href="default.css" />
<style>
</style>
</head>
<body>
<div class="profile-item">
<a id="plcMainContent_lstMatchs_ctrl2_lnkProfile_11" class="link" href="/7d0fb7e084f54a109b85da3b2cfced2f/" target="_blank">
<div>
<img src="/themes/default/images/nopicture.png" id="plcMainContent_lstMatchs_ctrl2_imgAvatar_11" />
</div>
<div class="profile-footer">
<div>
<span id="plcMainContent_lstMatchs_ctrl2_lblFirstName_11" class="name">بیتا</span>
<span>, </span>
<span id="plcMainContent_lstMatchs_ctrl2_lblAge_11">35</span>
</div>
<div class="location">
<span id="plcMainContent_lstMatchs_ctrl2_lblState_11">اصفهان</span>
<span>, </span>
<span id="plcMainContent_lstMatchs_ctrl2_lblCity_11">اصفهان</span>
</div>
</div>
<div id="plcMainContent_lstMatchs_ctrl2_pnlActivityStatus_1 1" class="user-off"></div>
<div id="plcMainContent_lstMatchs_ctrl2_pnlPremium_11"></div>
<div id="plcMainContent_lstMatchs_ctrl2_pnlTooltip_11" class="tooltip wrap">
<div class='field'><span class='caption'>ازدواج:</span><span>همسر مرحوم</span></div>
<div class='field'><span class='caption'>تحصیلات:</span><span>لیسانس</span></div>
<div class='field'><span class='caption'>معیار:</span><span>نیاز مالی</span></div>
<div class='field last'><span class='caption'>آخرین ورود:</span><span>1391/01/14</span></div>
</div>
</a>
</div>
</body>
</html>
اینم فایل css
/*=====================
Reset Elements
=======================*/
*{padding:0px;margin:0px;font-family: Tahoma; outline-style:none;}
body{font-family: Tahoma;font-size:13px;color:#333;direction:rtl; background:#D2D1D0; /*#FBFBFB;*//*background: #F4F4F4 url(images/body.gif);*/}
a {color: #21759B; outline-style:none; cursor:pointer;}
a:link, a:visited {color: #39B2E5;text-decoration: none;}
a:hover, a:active {text-decoration: underline;}
img {border:0px none;}
/*==================================
General
===================================*/
.field {margin-bottom:10px;}
.field.last {margin-bottom:0px;}
.field .caption {float:right; width:100px;}
.profile-item{width:150px; margin-bottom:10px;margin-left:5px; position:relative; padding:7px; float:right; border-radius:6px; -moz-border-radius:6px; -webkit-border-radius:6px;}
.profile-item .link {display:block; text-decoration:none; color:#333;}
.profile-item .link img{width:150px;height:146px;}
.profile-item .profile-footer{padding:4px 4px 4px 4px; text-align:right;}
.profile-item .user-on, .user-on {position:absolute;background:url('images/user-online.png') no-repeat;width:8px;height:8px; top:10px; right:10px;}
.profile-item .user-off, .user-off {position:absolute;background:url('images/user-offline.png') no-repeat;width:8px;height:8px; top:10px; right:10px;}
.profile-item .premium {position:absolute; background: url('images/gold-star.png') no-repeat; width:32px; height:32px; top:120px; right:10px}
.profile-item .name{font-weight:bold;}
.profile-item .top-box{position:absolute; width:80%; line-height:22px; text-align:center; background-color:#fff; top:12px; left:16px; z-index:10; opacity:.75; filter:alpha(opacity=75); behavior:none;}
.profile-item a.exclude {position:absolute; background:url(images/close.png) no-repeat; float:right; width:25px; height:25px; top:0px; right:0px; z-index:9999;}
.profile-item .location {overflow:hidden; white-space:normal; max-height:18px;}
.profile-item .tooltip {display: none; color:#fff;}
.profile-item .tooltip .field .caption {width:60px;}
div.profile-item:hover {background-color:#fff;-moz-box-shadow: 0 1px 2px #ccc;-ms-box-shadow: 0 1px 2px #ccc;-webkit-box-shadow: 0 1px 2px #ccc;box-shadow: 0 1px 2px #ccc;}
div.profile-item:hover .tooltip {background:#000;opacity:.70;filter:alpha(opacity= 70);cursor:pointer;width:130px;height:126px;displa y: block;padding:10px;text-align:justify;overflow:hidden; top:7px; right:7px;z-index:100;font-size:11px; position:absolute;}
با عرض پوزش از خانم بیتا :لبخند: