Кнопки под социальные сети или на официальные ресурсе, которые можно установить на свой сайт, что отлично созданные по дизайн. Каждая из ниж идет под ссылку и безусловно само изображение будет уже обозначать, на какую тематику вы попадете. Это может быть как внутри своего интернет портала или на спонсора. Лучшем использовать в самой площадке, если не по теме, то решается по смене как не сложно, где размер в стилях задается.
Больше всего можно заметить, что их создают под категорий и задают решение под навигацию. По стилистике все шикарно выставлены, что подойдет на светлый или темный фон. Где производится по несколько пикселей обвод и формируется фигура, что веб мастер сам редактирует под свой формат шаблона.
Ставим там где считаете нужным.
HTML Код
<span class="taserkun"></span>
<span class="runimatun">
<a href="http://zornet.ru/"><img src="http://kamorka.ucoz.com/Knopki/soc_seti/ARMA.jpg" border="0"></a>
<a href="/"><img src="http://kamorka.ucoz.com/Knopki/soc_seti/vk.jpg" border="0"></a>
<a href="/"><img src="http://kamorka.ucoz.com/Knopki/soc_seti/youtube.jpg" border="0"></a>
<a href="/"><img src="http://kamorka.ucoz.com/Knopki/soc_seti/steam.jpg" border="0"></a>
</span>
CSS Код
.runimatun img {display: block;float: left;width: 75px;height: 75px;margin-right: 6px;padding: 0px;border-radius: 50px;border: 4px solid #dadada;box-shadow: 0px 0px 8px 2px #929292;}
.runimatun1 { position: absolute;
font-family: 'Roboto', sans-serif;
color: #fff;
float: left;
width: 175px;
height: 18px;
margin-top: 140px;}
.taserkun { position: absolute;
font-family: 'Roboto', sans-serif;
color: #fff;
float: left;
width: 175px;
height: 18px;
margin-top: 140px;}
.taserkun img { display: block;float: left;width: 40px;height: 40px;margin-right: 6px;padding: 0px;border-radius: 50px;border: 6px solid #50555d;
е забываем, что при каждой смени или редакций лучше сохранить основу, всегда пригодиться