بسم الله الرحمن الرحيم
هيدر محول من استايل vb ازرق احترافي مع ازرار متغيره احترافية
تحويل : الرسام
______________________________
معاينة الكود :
https://i.servimg.com/u/f21/16/46/77/76/uo_ouo10.png
______________________________
تركيب الكود :
توجه نحو لوحة الادارة - مظهر المنتدى - التومبيلات والقوالب - ادارة عامة - قالب overall_header
ابحث عن الكود التالي
الكود:
{javascript}نضع اسفله الكود التالي
الكود:
<style type="text/css">
body
{
background: #f3f3f3;
color: #033d50;
font: bold 12pt Times New Roman;
margin: 0px;
padding: 0px;
}
a:link, body_alink
{
color: #00407f;
text-decoration: none;
}
a:visited, body_avisited
{
color: #00407f;
text-decoration: none;
}
a:hover, a:active, body_ahover
{
color: #ef8100;
}
.page
{
background: #f3f3f3;
color: #033d50;
font: bold 12pt Times New Roman;
margin: 0px;
padding: 0px;
}
.tborder
{
background: #CCCCCC;
color: #CCCCCC;
border:#f4f4f4 solid 1px;
}
.tcat
{
background: #2D81B8 url(http://i21.servimg.com/u/f21/16/46/77/76/s110.png) repeat-x top left;
color: #FFFFFF;
font: bold 11px tahoma, verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
text-shadow: 1px 1px 0px #002a41;
}
.tcat a:link, .tcat_alink
{
color: #ffffff;
text-decoration: none;
}
.tcat a:visited, .tcat_avisited
{
color: #ffffff;
text-decoration: none;
}
.tcat a:hover, .tcat a:active, .tcat_ahover
{
color: #ffcc00;
}
.thead
{
background: #d0d0d0 url(http://i21.servimg.com/u/f21/16/46/77/76/a310.png) repeat-x top left;
color: #00407f;
font: bold 11px tahoma, verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
text-shadow: 1px 1px 0px #ffffff;
}
.thead a:link, .thead_alink
{
color: #00407f;
}
.thead a:visited, .thead_avisited
{
color: #00407f;
}
.thead a:hover, .thead a:active, .thead_ahover
{
color: #ef8100;
}
.tfoot
{
background: #d0d0d0 url(http://i21.servimg.com/u/f21/16/46/77/76/a310.png) repeat-x top left;
color: #033d50;
font: bold 11px tahoma, arial, verdana, geneva, lucida, helvetica;
text-shadow: 1px 1px 0px #FFFFFF;
border:1px solid #c2c2c2;
border-bottom:1px solid #808080;
-webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;
}
.tfoot a:link, .tfoot_alink
{
color: #033d50;
}
.tfoot a:visited, .tfoot_avisited
{
color: #033d50;
}
.tfoot a:hover, .tfoot a:active, .tfoot_ahover
{
color: #ef8100;
}
.alt1, .alt1Active
{
background: #fafafb;
color: #033d50;
text-shadow: 1px 1px 0px #ffffff;
}
.alt2, .alt2Active
{
background: #ffffff;
color: #0f5065;
text-shadow: 1px 1px 0px #ffffff;
}
.inlinemod
{
background: #FFFFFF;
color: #0f5065;
}
.wysiwyg
{
background: #F5F5FF;
color: #033d50;
font: bold 12pt Times New Roman;
}
.wysiwyg a:link, .wysiwyg_alink
{
color: #0f5065;
}
.wysiwyg a:visited, .wysiwyg_avisited
{
color: #0f5065;
}
.wysiwyg a:hover, .wysiwyg a:active, .wysiwyg_ahover
{
color: #ef8100;
}
textarea, .bginput
{
font: bold 11px tahoma, arial, verdana, geneva, lucida, helvetica;
}
.bginput option, .bginput optgroup
{
font-size: 11px;
font-family: tahoma, arial, verdana, geneva, lucida, helvetica;
}
.button
{
font: bold 11px tahoma, arial, verdana, geneva, lucida, helvetica;
}
select
{
font: bold 11px tahoma, arial, verdana, geneva, lucida, helvetica;
}
option, optgroup
{
font-size: 11px;
font-family: tahoma, arial, verdana, geneva, lucida, helvetica;
}
.smallfont
{
font: bold 11px tahoma, arial, verdana, geneva, lucida, helvetica;
}
.time
{
color: #000033;
}
.navbar
{
font: bold 11px tahoma, arial, verdana, geneva, lucida, helvetica;
padding:3px;
}
.highlight
{
color: #FF0000;
font-weight: bold;
}
.fjsel
{
background: #0f5065;
color: #FFFFFF;
}
.fjdpth0
{
background: #F7F7F7;
color: #000000;
}
.panel
{
background: #eaf2f6;
color: #0f5065;
font: bold 11px tahoma, arial, verdana, geneva, lucida, helvetica;
padding: 10px;
border-right:3px solid #09F;
border-left:3px solid #09F;
border-top:1px solid #CCC;
border-bottom:1px solid #CCC;
-moz-border-radius:9px;-webkit-border-radius:9px;border-radius:9px;
}
.panel a:link, .panel_alink
{
color: #0f5065;
}
.panel a:visited, .panel_avisited
{
color: #0f5065;
}
.panel a:hover, .panel a:active, .panel_ahover
{
color: #000033;
}
.panelsurround
{
background: #FFFFFF;
color: #0f5065;
font: bold 11px tahoma, arial, verdana, geneva, lucida, helvetica;
padding: 5px;
}
legend
{
background: #d0d0d0 url(http://i21.servimg.com/u/f21/16/46/77/76/a310.png) repeat-x top left;
color: #0f5065;
font: bold 11px tahoma, verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
border:1px solid #888A99;
-moz-border-radius:4px;-webkit-border-radius:4px;border-radius:6px;
text-shadow:#fff 0px 1px 0px;
padding-right:6px;
padding-left:8px;
padding-top:4px;
padding-bottom:4px;
}
.vbmenu_control
{
background: #42ABCA url(http://i21.servimg.com/u/f21/16/46/77/76/s111.png) repeat-x top left;
color: #FFFFFF;
font: bold 11px tahoma, verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
padding: 3px 6px 3px 6px;
white-space: nowrap;
text-shadow: 1px 1px 0px #002a41;
}
.vbmenu_control a:link, .vbmenu_control_alink
{
color: #FFFFFF;
text-decoration: none;
}
.vbmenu_control a:visited, .vbmenu_control_avisited
{
color: #FFFFFF;
text-decoration: none;
}
.vbmenu_control a:hover, .vbmenu_control a:active, .vbmenu_control_ahover
{
color: #FDDF00;
text-decoration: text-shadow:#fff 0px 1px 0px;;
}
.vbmenu_popup
{
background: #dedede;
color: #0f5065;
font: bold 11px tahoma, arial, verdana, geneva, lucida, helvetica;
border: 1px solid #aeaeae;
}
.vbmenu_option
{
background: #f7f7f7;
color: #0f5065;
font: bold 11px tahoma, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif;
white-space: nowrap;
cursor: pointer;
text-shadow:#fff 0px 1px 0px;
}
.vbmenu_option a:link, .vbmenu_option_alink
{
color: #0f5065;
text-decoration: none;
}
.vbmenu_option a:visited, .vbmenu_option_avisited
{
color: #0f5065;
text-decoration: none;
}
.vbmenu_option a:hover, .vbmenu_option a:active, .vbmenu_option_ahover
{
color: #FFFFFF;
text-decoration: none;
}
.vbmenu_hilite
{
background: #fff;
color: #005068;
font: bold 11px tahoma, arial, verdana, geneva, lucida, helvetica;
white-space: nowrap;
cursor: pointer;
text-shadow:#fff 0px 1px 0px;
border-right:3px #ff8200 solid;
-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:5px;
}
.vbmenu_hilite a:link, .vbmenu_hilite_alink
{
text-decoration: none;
}
.vbmenu_hilite a:visited, .vbmenu_hilite_avisited
{
text-decoration: none;
}
.vbmenu_hilite a:hover, .vbmenu_hilite a:active, .vbmenu_hilite_ahover
{
text-decoration: none;
}
/* ***** styling for 'big' usernames on postbit etc. ***** */
.bigusername { font-size: 14pt; }
/* ***** small padding on 'thead' elements ***** */
td.thead, th.thead, div.thead { padding: 4px; }
/* ***** basic styles for multi-page nav elements */
.pagenav a { text-decoration: none; }
.pagenav td { padding: 2px 4px 2px 4px; }
/* ***** de-emphasized text */
.shade, a.shade:link, a.shade:visited { color: #777777; text-decoration: none; }
a.shade:active, a.shade:hover { color: #FF4400; text-decoration: underline; }
.tcat .shade, .thead .shade, .tfoot .shade { color: #DDDDDD; }
/* ***** define margin and font-size for elements inside panels ***** */
.fieldset { margin-bottom: 6px; }
.fieldset, .fieldset td, .fieldset p, .fieldset li { font-size: 11px; }
/*************** TRAIDNT STYLE BY : MooOOooN ****************/
.exp {
background-image:url(http://i21.servimg.com/u/f21/16/46/77/76/exp10.png);
background-repeat:repeat-x;
height:301px;
}
.rtla {
background-image:url('http://i21.servimg.com/u/f21/16/46/77/76/tr-211.png');
background-repeat:no-repeat;
width:402px;
height:14px;
float:right;
}
.botton1 {background:url('http://i21.servimg.com/u/f21/16/46/77/76/home-b10.png') no-repeat ; height:41px; width:86px; float:right; background-position: 0px 0px; display: block;margin-top:14px;}
.botton2 {background:url('http://i21.servimg.com/u/f21/16/46/77/76/reg-b10.png') no-repeat ; height:41px; width:81px; float:right; background-position: 0px 0px; display: block;margin-top:14px;}
.botton3 {background:url('http://i21.servimg.com/u/f21/16/46/77/76/con-b10.png') no-repeat ; height:41px; width:82px; float:right; background-position: 0px 0px; display: block;margin-top:14px;}
.botton4 {background:url('http://i21.servimg.com/u/f21/16/46/77/76/msg-b10.png') no-repeat ; height:41px; width:100px; float:right; background-position: 0px 0px; display: block;margin-top:14px;}
.botton1:hover {background:url('http://i21.servimg.com/u/f21/16/46/77/76/home-b10.png') no-repeat ; height:41px; width:86px; float:right; background-position: 0px -41px; display: block;margin-top:14px;}
.botton2:hover {background:url('http://i21.servimg.com/u/f21/16/46/77/76/reg-b10.png') no-repeat ; height:41px; width:81px; float:right; background-position: 0px -41px; display: block;margin-top:14px;}
.botton3:hover {background:url('http://i21.servimg.com/u/f21/16/46/77/76/con-b10.png') no-repeat ; height:41px; width:82px; float:right; background-position: 0px -41px; display: block;margin-top:14px;}
.botton4:hover {background:url('http://i21.servimg.com/u/f21/16/46/77/76/msg-b10.png') no-repeat ; height:41px; width:100px; float:right; background-position: 0px -41px; display: block;margin-top:14px;}
.social {
background-image:url(http://i21.servimg.com/u/f21/16/46/77/76/social10.png);
background-repeat:no-repeat;
height:49px;
width:118px;
float:left;
margin-top:10px;
}
.search {
background-image:url(http://i21.servimg.com/u/f21/16/46/77/76/search12.png);
background-repeat:no-repeat;
height:50px;
width:243px;
float:left;
margin-top:10px;
}
.postion {
float:left;
position: absolute;
top:70px;
left:70px;
}
.text-search {background:url('http://i21.servimg.com/u/f21/16/46/77/76/space10.png'); position: absolute; border:0px; top:23px; left:69px; width:134px; height:22px; font-family:tahoma; font-size:12px; color:#00334d; text-shadow:#fff 0px 1px 0px; }
.searchsubmit {background:url('http://i21.servimg.com/u/f21/16/46/77/76/space10.png'); position: absolute; border:0px; top:15px; left:5px; width:58px; height:37px; cursor: pointer; }
.searchsubmit:hover {background:url('http://i21.servimg.com/u/f21/16/46/77/76/search11.png'); position: absolute; border:0px; top:19px; left:7px; width:54px; height:32px; cursor: pointer; }
.logo {
background-image:url('http://i21.servimg.com/u/f21/16/46/77/76/logo11.png');
background-repeat:no-repeat;
width:403px;
height:230px;
float:right;
margin-top:16px;
}
</style>
</head>
<body>
<div class="exp">
<div class="rtla">
<a href="#"><div class="botton1"></div></a>
<a href="#"><div class="botton2"></div></a>
<a href="#"><div class="botton3"></div></a>
<a href="#"><div class="botton4"></div></a>
<div class="logo"></div>
</div>
<div class="search">
<form method="get" class="searchform" action="/search">
<input type="text" size="24" value="ادخل كلمة البحث ..." name="s" onfocus="if(this.value=='ادخل كلمة البحث...'){this.value=''};" onblur="if(this.value==''){this.value='ادخل كلمة البحث...'};" class="text-search"/>
<input type="submit" title="ابدأ البحث" class="searchsubmit" value=""/>
</form>
</div>
<div class="social">
<map name="FPMap0">
<area title="صفحتنا على الفيس بوك" coords="2, 5, 42, 47" shape="rect" target="_blank" href="http://www.facebook.com/"/>
<area target="_blank" title="تابعنا على تويتر" coords="42, 7, 79, 48" shape="rect" href="http://www.twitter.com">
<area target="_blank" title="التغذيات RSS" coords="80, 7, 116, 48" shape="rect" href="#"/>
</map><img src="http://i21.servimg.com/u/f21/16/46/77/76/social11.png" usemap="#FPMap0"/>
</div>
</div>
</body>
</html>
______________________________
انتهى
بالتوفيق للجميع
والسلام ختام
