[حصري] كود ازرار بشكل جميل وله تأثير عند الضغط عليها

من طرف **على** الجمعة أغسطس 11, 2017 10:08 pm

كود ازرار بشكل جميل وله تأثير عند الضغط عليها

صورة له

[حصري] كود ازرار بشكل جميل وله تأثير عند الضغط عليها 150248434898611

كود css

الكود:: body{background:#ffffff;color:#000000;font:10px arial,verdana,geneva,lucida,'lucida grande',arial,helvetica,sans-serif;margin:0px;padding:0px;}a:link,body_alink{color:#A35308;text-decoration:none;}a:visited,body_avisited{color:#A35308;text-decoration:none;}a:hover,a:active,body_ahover{color:#65CC45;text-decoration:underline;}.page{background:#FFFFFF;color:#666666;#border: 1px solid #E3E0C7;#border-right: 2px solid #E3E0C7;#border-left: 2px solid #E3E0C7;}td,th,p,li{font:bold 11pt arial,verdana,geneva,lucida,'lucida grande',arial,helvetica,sans-serif;}.tborder{background:#F9F6E0;color:#000000;}.tcat{background:#666666 linear-gradient(to top,#ED7A0A 0%,#F39A4A 100%);color:#FFFFFF;font:bold 11pt arial,verdana,geneva,lucida,'lucida grande',helvetica,sans-serif;text-align:center;}.tcat a:link,.tcat_alink{color:#F3FFFF;text-decoration:none;}.tcat a:visited,.tcat_avisited{color:#F5FFFF;text-decoration:none;}.tcat a:hover,.tcat a:active,.tcat_ahover{color:#FFFFFF;text-decoration:underline;}.thead{background:#EBDEA9 linear-gradient(to top,#ECDAA3 0%,#F9F2C6 100%);color:#71610B;font:11px tahoma,verdana,geneva,lucida,'lucida grande',arial,helvetica,sans-serif;}.thead a:link,.thead_alink{color:#767569;}.thead a:visited,.thead_avisited{color:#767569;}.thead a:hover,.thead a:active,.thead_ahover{color:#4A912F;}.tfoot{background:#444334 linear-gradient(to top,#444334 0%,#5c5c3d 100%) repeat-x;color:#FFFFFF;#border: 1px solid #F3F3E9;}.tfoot a:link,.tfoot_alink{color:#E8E8E8;}.tfoot a:visited,.tfoot_avisited{color:#E8E8E8;}.tfoot a:hover,.tfoot a:active,.tfoot_ahover{color:#A3B71C;}.alt1,.alt1Active{background:#FFFFFF;color:#484006;font-size:11pt;font-weight:bold;border-bottom:1px solid #EAE3D1;border-right:1px solid #EAE3D1;border-left:1px solid #FFFFFF;border-top:1px solid #FFFFFF;}.alt2,.alt2Active{background:#F9F6E0;color:#484006;border-bottom:1px solid #EAE3D1;border-right:1px solid #EAE3D1;border-left:1px solid #FFFFFF;border-top:1px solid #FFFFFF;#FCF9F0}.inlinemod{background:#FFFFCC;color:#000000;}.wysiwyg{background:#FFFFFF;color:#000000;font:10pt verdana,geneva,lucida,'lucida grande',arial,helvetica,sans-serif;margin:5px 10px 10px 10px;padding:0px;}.wysiwyg a:link,.wysiwyg_alink{color:#8F0000;}.wysiwyg a:visited,.wysiwyg_avisited{color:#A35308;}.wysiwyg a:hover,.wysiwyg a:active,.wysiwyg_ahover{color:#767569;}textarea,.bginput{font:11px tahoma,verdana,geneva,lucida,'lucida grande',arial,helvetica,sans-serif;}.bginput option,.bginput optgroup{font-size:11px;font-family:tahoma,verdana,geneva,lucida,'lucida grande',arial,helvetica,sans-serif;}.button{font:11px Tahoma;}select{font:11px Tahoma;}option,optgroup{font-size:11px;font-family:Tahoma;}.smallfont{font:11px Tahoma;}.time{color:#FF6633;}.navbar{font:12px Tahoma,verdana;}.highlight{color:#FF0000;font-weight:bold;}.fjsel{background:#3E5C92;color:#E0E0F6;}.fjdpth0{background:#F7F7F7;color:#000000;}.panel{background:#F8F8F8;color:#000000;padding:10px;border:2px outset;}.panelsurround{background:#666666 linear-gradient(to top,#EC943F 0%,#F39A4A 100%);color:#677312;}legend{color:#22229C;font:11px tahoma,verdana,geneva,lucida,'lucida grande',arial,helvetica,sans-serif;}.vbmenu_control{background:#666666 linear-gradient(to top,#FF7F00 0%,#DC7009 100%) 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;}.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:#FFFFFF;text-decoration:underline;}.vbmenu_popup{background:#FFFFFF;color:#000000;border:1px solid #EBDEA9;}.vbmenu_option{background:#F9F6E0;color:#594F07;font:11px tahoma,verdana,geneva,lucida,'lucida grande',arial,helvetica,sans-serif;white-space:nowrap;cursor:pointer;}.vbmenu_option a:link,.vbmenu_option_alink{color:#AD5707;text-decoration:none;}.vbmenu_option a:visited,.vbmenu_option_avisited{color:#AD5707;text-decoration:none;}.vbmenu_option a:hover,.vbmenu_option a:active,.vbmenu_option_ahover{color:#DB6E08;text-decoration:none;}.vbmenu_hilite{background:#F9F6E0;color:#594F07;font:11px tahoma,verdana,geneva,lucida,'lucida grande',arial,helvetica,sans-serif;white-space:nowrap;cursor:pointer;}.vbmenu_hilite a:link,.vbmenu_hilite_alink{color:#AD5707;text-decoration:none;}.vbmenu_hilite a:visited,.vbmenu_hilite_avisited{color:#AD5707;text-decoration:none;}.vbmenu_hilite a:hover,.vbmenu_hilite a:active,.vbmenu_hilite_ahover{color:#DB6E08;text-decoration:none;}.bigusername{font-size:14pt;}td.thead,th.thead,div.thead{padding:4px;}.pagenav a{text-decoration:none;}.pagenav td{padding:2px 4px 2px 4px;}.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;}.fieldset{margin:10px;}.fieldset,.fieldset td,.fieldset p,.fieldset li{font:11px tahoma,verdana;}.info{padding:3px;background-color:#f7f7e6;border-top:1px solid #dedec1;border-right:2px solid #dedec1;border-left:1px solid #dedec1;border-bottom:2px solid #dedec1;margin-bottom:3px;}.header{color:#FFFFFF;}a.header:link,a.header:visited{color:#FFFFFF;text-decoration:none;}a.header:active,a.header:hover{color:#FF4400;text-decoration:underline;}.noti{color:#FFFFFF;font:bold 10pt tahoma,arial;}a.noti:link,a.noti:visited{color:#FFFFFF;font:bold 10pt tahoma,arial;text-decoration:none;}a.noti:active,a.noti:hover{color:#FEFFC9;font:bold 10pt tahoma,arial;}.sidenav{height:100%;width:0;position:fixed;z-index:1;top:0;right:0;background-color:#ffe0b3;overflow-x:hidden;transition:.2s;padding-top:0px}.sidenav ul{padding:0px}.sidenav li{font-family:serif;border-top-width:1px;border-top-style:solid;border-top-color:#FFFFFF;}.sidenav a:hover,.offcanvas a:focus{color:#9acd32;background-color:#e6e6e6}.sidenav .closebtn{text-align:center;font-size:30px;}.sidenav{padding-top:1px;z-index:5}.sidenav a{font-size:20px;text-decoration:none;padding:10px;font-size:18px;display:block;transition:0.3s}.n-overlay{position:fixed;display:none;width:100%;height:100%;top:0;left:0;right:0;bottom:0;background-color:rgba(0,0,0,0.5);z-index:2}.n-animate-opacity{-webkit-animation:opac 0.8s;animation:opac 0.8s}@media only screen and (min-width : 780px) {.pbm{display:none}}.Message img{width:auto;height:auto;max-width:90%}.Sig img{max-width:80%;width:auto;height:auto}.mpd{width:97%;margin:auto}.topbutton{background-color:#4CAF50;border:none;color:#fff;padding:4px;text-align:center;text-decoration:none;display:inline-block;font-size:16px;margin:2px;cursor:pointer;font-weight:700;font-family:Arial,Helvetica,sans-seriff;-webkit-transition-duration:.4s;transition-duration:.4s;border-radius:8px}.button1{background-color:#fff;color:#000;border:2px solid #4CAF50}.button1:hover{background-color:#4CAF50;color:#fff}.button2{background-color:#fff;color:#000;border:2px solid #008CBA}.button2:hover{background-color:#008CBA;color:#fff}.button3{background-color:#fff;color:#000;border:2px solid #f44336}.button3:hover{background-color:#f44336;color:#fff}@media only screen and (max-width: 555px) {.lostpass{display:none}}.corepbm a{border-bottom:2px solid #e7ff00;}.corepbm a:hover{border-bottom:2px solid #cb1c1c;text-decoration:none;}@media only screen and (max-width: 780px) {.m{display:none}.mhome{max-width:80px}.pbm{display:block}.corepbm{font-size:17px;line-height:1.6em}.corepbm font{font-size:17px;word-break:normal;overflow-wrap:break-word}.corepbm a{font-size:16px;word-break:break-all}.corepbm img{width:auto;height:auto;max-width:94%}#header_right_cell img{max-width:100%;width:auto;height:auto}.pnr{float:right}.pnl{float:left}.pagenav td{display:inline-table}.signbutton{margin-right:5px}}.meminfo{width:167px;color:#208d29;background-color:white;text-align:right;margin:0 auto;border:solid 1px;border-radius:4px;padding-right:4px;}.visitortophead{width:100%;margin:auto;padding-top:1px;height:41px;display:flex;margin-bottom:2px;background:rgb(34,34,17) linear-gradient(to top,rgb(34,34,17) 0%,rgb(68,68,34) 100%);border-bottom:2px solid rgb(223,146,44);}.membtophead{display:block;}.visitorrightnavmenu{font-size:30px;right:0px;top:0px;cursor:pointer;color:greenyellow;padding-right:5px;padding-left:5px;position:fixed;background-color:#0000ff;font-weight:bolder;}.biglogopc{margin:auto;text-align:center;max-width:178px;padding-right:40px;}.logo2cells{margin:auto;width:100%;height:auto;display:inline-block;background-color:#F3EFE3}.logo40{margin:auto;text-align:center;max-width:178px;padding-right:50px;}.logocellleft{text-align:center;margin:2px;}.upforumarrow{font-size:29px;right:0px;bottom:0px;cursor:pointer;color:greenyellow;padding-right:8px;padding-left:8px;position:fixed;background-color:#0000ff;border-top-left-radius:10px;z-index:6;}.neswangynotepic{margin:auto;text-align:center;}.forumtextnote{margin:0 auto;text-align:center;font-size:16px;background:#124162 linear-gradient(to top,#1879d4 0%,#78aeff 100%);color:white;padding:5px;font-weight:bold;}.sprite{background-image:url('../../images/spritesheet.png');background-repeat:no-repeat;display:inline-block;}.sprite-bookmarksite_google{width:16px;height:16px;background-position:-4px -4px;}.sprite-bookmarksite_twitter{width:16px;height:16px;background-position:-28px -4px;}.sprite-collapse_tcat{width:14px;height:14px;background-position:-52px -4px;}.sprite-collapse_tcat_collapsed{width:14px;height:14px;background-position:-74px -4px;}.sprite-collapse_thead{width:15px;height:15px;background-position:-96px -4px;}.sprite-collapse_thead_collapsed{width:15px;height:15px;background-position:-119px -4px;}.sprite-fb{width:16px;height:16px;background-position:-142px -4px;}.sprite-forum_new{width:55px;height:58px;background-position:-4px -28px;}.sprite-forum_old{width:55px;height:58px;background-position:-67px -28px;}.sprite-home-icon{width:16px;height:16px;background-position:-166px -4px;}.sprite-key{width:32px;height:32px;background-position:-130px -28px;float:right;margin-right:44px;margin-top:3px;}.sprite-lastpost{width:12px;height:12px;background-position:-190px -4px;}.sprite-menu_open{width:11px;height:7px;background-position:-190px -24px;}.sprite-navbits_finallink_rtl{width:35px;height:15px;background-position:-170px -39px;}.sprite-navbits_start{width:16px;height:16px;background-position:-170px -62px;}.sprite-newthread{width:140px;height:35px;background-position:-4px -94px;}.sprite-post_new{width:10px;height:11px;background-position:-194px -62px;}.sprite-post_old{width:10px;height:11px;background-position:-152px -81px;}.sprite-printer{width:21px;height:17px;background-position:-170px -86px;}.sprite-quote{width:70px;height:20px;background-position:-4px -137px;}.sprite-reply{width:107px;height:40px;background-position:-82px -137px;}.sprite-reputation_pos{width:8px;height:10px;background-position:-199px -81px;}.sprite-search_box_icon{width:13px;height:13px;background-position:-152px -111px;}.sprite-sendtofriend{width:21px;height:17px;background-position:-173px -111px;}.sprite-stats{width:45px;height:45px;background-position:-213px -4px;}.sprite-sticky{width:12px;height:12px;background-position:-213px -57px;}.sprite-subforum_new{width:11px;height:11px;background-position:-233px -57px;}.sprite-subforum_old{width:11px;height:11px;background-position:-233px -76px;}.sprite-tag{width:13px;height:13px;background-position:-215px -95px;}.sprite-twitter-icon{width:18px;height:16px;background-position:-236px -95px;}.sprite-user_offline{width:30px;height:30px;background-position:-202px -119px;}.sprite-user_online{width:30px;height:30px;background-position:-197px -157px;}.sprite-whos_online{width:45px;height:45px;background-position:-4px -195px;} .fade { display:inline-block; background: -moz-linear-gradient(left, rgb(235,234,221) 0%, rgba(235,234,221,0) 100%); background-image: -webkit-gradient(linear, left top, right top, color-stop(0.00, rgb(235,234,221)), color-stop(1.00, rgba(235,234,221,0))); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#ebeadd, endColorstr=#00ebeadd, GradientType=1); -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#ebeadd, endColorstr=#00ebeadd, GradientType=1)"; } .blur { display:inline-block; color:#ddd; text-shadow: 0 0 2px #aaaaaa; text-shadow: 0 0 4px #aaaaaa; text-shadow: 0 0 6px #aaaaaa; -ms-filter: "progid:DXImageTransform.Microsoft.Blur(pixelradius=2)"; filter: progid:DXImageTransform.Microsoft.MotionBlur(strength=1,direction=310) progid:DXImageTransform.Microsoft.Blur(pixelradius=2); } .flipH { display:inline-block; -moz-transform:scale(-1,1); -o-transform:scale(-1,1); -webkit-transform:scale(-1,1); transform:scale(-1,1); -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=-1, M12=0, M21=0, M22=1, SizingMethod='auto expand')"; filter: progid:DXImageTransform.Microsoft.Matrix( M11=-1, M12=0, M21=0, M22=1, SizingMethod="auto expand"); } .flipV { display:inline-block; -moz-transform:scale(1,-1); -o-transform:scale(1,-1); -webkit-transform:scale(1,-1); transform:scale(1,-1); -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(M11=1, M12=0, M21=0, M22=-1, SizingMethod='auto expand')"; filter: progid:DXImageTransform.Microsoft.Matrix( M11=1, M12=0, M21=0, M22=-1, SizingMethod="auto expand"); }

كود HTML

الكود:: <div style="margin:auto;text-align:center;"> <a href="/" target="_blank" rel="noopener"><span class="topbutton button2">مرحباً بك</span> </a><a href="/" target="_blank" rel="noopener"><span class="topbutton button1">مرحباً بك</span> </a><a href="/" target="_blank" rel="noopener"><span class="topbutton button3">مرحباً بك</span> </a><a href="/" target="_blank" rel="noopener"><span class="topbutton button2">مرحباً بك</span> </a> </div> <div class="neswangynotepic"> <div> <a href="/" target="_blank" rel="noopener"><span class="topbutton button3">جميع ما يطرح بالمنتدى لا يعبر عن رأي الاداره وانما يعبر عن رأي صاحبه فقط</span> </a></div> <div> <a href="/" target="_blank" rel="noopener"><span class="topbutton button1">اذكر الله و صل على الحبيب</span> </a> <a href="/" target="_blank" rel="noopener"><span class="topbutton button2">اذكر الله و صل على الحبيب</span> </a> <a href="/" target="_blank" rel="noopener"><span class="topbutton button3">اذكر الله و صل على الحبيب</span> </a> <a href="/" target="_blank" rel="noopener"><span class="topbutton button1">اذكر الله و صل على الحبيب</span> </a> </div> </div>