اضافة مواقع التواصل الاجتماعى على هيئة أزرار بتقنية Css جميلة جدًا

معاينــــــــــــة الإضافـــــــــــــة

ضع هذا الكود فى أداة Html/Javascript 

من مدونتك 

<div class='widget-content'><style>#sub_widget{margin-bottom:30px;max-width:480px;background:#ddd;max-height:400px;border:4px ridge green;-moz-border-radius:12px;-webkit-border-radius:12px;border-radius:12px;margin-top:20px}#sbsr{height:70px}#bts{margin:9px 0 0 15px;float:center}#bts img{border-style:none}.gap{margin:auto 2px}#pra{float:left;margin:-6px 0 0 20px;color:#000;font-size:14px;font-family:arial;font-weight:bold}.newsletter{height:35px;float:left;margin:10px 0 60px 0}.button{margin-top:5px;color:#fff;width:100px;font-family:arial;font-weight:bold;font-size:16px;text-margin-left:-10px;background:green}.email{width:250px;height:25px;font-size:12px;text-margin:0 auto;pading:10px auto;background:white}</style><div id="sub_widget"><center><img id="sbsr" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiUth-RAJ0i0EqZiupS_mUj-JHAJ7hangqGl_K2zb6N-TL6K03guKdG4c5pWCDjRIiGEhKydazaF4LFD_dN82wNSnUdvoEO8pdt9GLp1I23qM9kl5zVqNhykvB6p37vuTN1yFK9h6phHzL2/s734/rss-subscribe.png"/></center><center><div class="newsletter"><form action="http://feedburner.google.com/fb/a/mailverify" class="subscribe-form" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=bilokr','popupwindow','scrollbars=yes,width=550,height=520');return true" target="popupwindow"><input class="email" name="email" onblur="if(this.value==''){this.value='E-mail';}" onfocus="if(this.value=='E-mail'){this.value='';}" type="text" value="اكتب ايميلك هنا..." /><input name="uri" type="hidden" value="bilokr" /><input name="title" type="hidden" value="bilokr" /><input name="loc" type="hidden" value="en_IN" /><input class="button" name="submit" type="submit" value="إشتراك" /></form></div></center><center><div id="bts"><a rel="nofollow" class="gap" href="رابط حسابك على الخلاصة target="_blank"><img onmouseout="this.src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjPJRon9OYbarqGf-AUkVWYB0nH4zoaQnRKYvSVoTvRIjIXnWpDBA1FhB5MQW-9vOqEAK1iJFSddOVaqRKkExp5Fg59K5N1RtVrh8M02W_NwX1jCc1PZa9DuNeW5YfbFDd924I6qEFjVBhn/s1600/Rss.png'" onmouseover="this.src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhYmKQohLZNqpb-gU0HGqIpE0SwLHs8FK_OoRWGYV0by9lqs4Q1xBP7kj1lJznMq_ruLrTN9zzgci6jxd3iN5TWqh_uff11jgWyohHH8D3GnVSSFtXC352UVtvt07VAYAUcqulJ38Q-SX4d/s1600/Rss_pressed.png'" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjPJRon9OYbarqGf-AUkVWYB0nH4zoaQnRKYvSVoTvRIjIXnWpDBA1FhB5MQW-9vOqEAK1iJFSddOVaqRKkExp5Fg59K5N1RtVrh8M02W_NwX1jCc1PZa9DuNeW5YfbFDd924I6qEFjVBhn/s1600/Rss.png" title="Subscribe Via Rss" alt="RSS" /></a><a rel="nofollow" class="gap" href="رابط حسابك الشخصى على جوجل بلس" target="_blank"><img onmouseout="this.src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgOu-S7YMOcfSgdRtSFRvq_u9fFjiDuesNj1K-qfcG3WTJS1rK2DXQf-K_aR2PN9ORrtqivW4CJCjpxnTw2Bem6jnfDVZcciHA39PZGXaDOxkzbgyyB0SreeCwuJW_AhLp5r6wUfKluYjq6/s1600/Google.png'" onmouseover="this.src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhOZSkPQ7a9W8-3AHv_HZf8k99v5qcjuh5QrKu5SIa_LJUppT8U5cxkBnteCGomaFaPgNdL796R4g6QWIYX-oENiN5ysW5kFyxy_iJjMlytdlZcXlpXiI400kvN8wCX-iT41lsSZ_qplIvo/s1600/Google_pressed.png'" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgOu-S7YMOcfSgdRtSFRvq_u9fFjiDuesNj1K-qfcG3WTJS1rK2DXQf-K_aR2PN9ORrtqivW4CJCjpxnTw2Bem6jnfDVZcciHA39PZGXaDOxkzbgyyB0SreeCwuJW_AhLp5r6wUfKluYjq6/s1600/Google.png" title="Follow Us On Google plus" alt="Google" /></a><br/><a rel="nofollow" class="gap" href="رابط صفحتك على الفيس بوك" target="_blank"><img onmouseout="this.src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgTDUuNJIakQMjOT4FEMONIABLTmM0svXFPSStN4XpO4ycXmr27U_K91fCVwzNSNOaxEzOnxs-sU2cs8Y7l7RmM78Xktu4YS49u8WtLw0dcgQONpiNRsRX7HKL_4pvvpcskL6LNuTrMG92E/s1600/Facebook.png'" onmouseover="this.src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhUorscFbdHBpU1Cc7UB3n_-kRBt8bnvmdh4mkhYl5qypmBSrqniNtL9xQI82FWn_AsYZqgMOKfLhieHo8R6vOkMgSaEcIR7KhcDcRyOsyzo3YAcrrPTdrjKmnl1NjpSHj71qXvVISD8nVe/s1600/Facebook_Pressed.png'" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgTDUuNJIakQMjOT4FEMONIABLTmM0svXFPSStN4XpO4ycXmr27U_K91fCVwzNSNOaxEzOnxs-sU2cs8Y7l7RmM78Xktu4YS49u8WtLw0dcgQONpiNRsRX7HKL_4pvvpcskL6LNuTrMG92E/s1600/Facebook.png" title="Like Us On Facebook" alt="Facebook" /></a><a rel="nofollow" class="gap" href="رابط حسابك على تويتر" target="_blank"><img onmouseout="this.src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiZSEo6IqGz9He3GDQAQv6YAgo5czZ3v5sdTtzN_ltvc9CZuU_-rKPbBhaNz5Vv16h6lzZSRDttNZTeoQdSvs2wIN-TQEqN6isD3yEj0l4cXW24_lsXiSdbh8uf_SB4KWPu8zz40NMRLekQ/s1600/Twitter.png'" onmouseover="this.src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjSrxSqG6TxjCxwgojsS_8B8S-n1_9UggGDmgFjPhaPS5msoSV-rYI6MhT6_0cJxXtI48k85iHpB-pUx9LQ01sNNu9u3doLH6vjL5gXowmb3mlBlYFHsGbFBPO8n-k37omIRUrGVgJKK5A4/s1600/Twitter_Pressed.png'" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiZSEo6IqGz9He3GDQAQv6YAgo5czZ3v5sdTtzN_ltvc9CZuU_-rKPbBhaNz5Vv16h6lzZSRDttNZTeoQdSvs2wIN-TQEqN6isD3yEj0l4cXW24_lsXiSdbh8uf_SB4KWPu8zz40NMRLekQ/s1600/Twitter.png" title="Follow Us On Twitter" alt="Twitter" /></a></div></center></div></div>