<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <div id="tegcloud" class="col-lg-offset-4 col-lg-4"> <a href="#">идентификатор</a> <a href="#">Программирование</a> <a href="#">бирка</a> <a href="#">задания</a> <a href="#">выделении</a> <a href="#">описания</a> <a href="#">разметки</a> <a href="#">Голосовой</a> <a href="#">продюсера</a> <a href="#">группы</a> <a href="#">eiusmod</a> <a href="#">названию</a> <a href="#">используемая</a> <a href="#">каждые</a> <a href="#">вместо</a> </div>

.tegcloud { height:300px; } .teg-1 { font-size: 12px; color: rgb(52, 152, 219); } .teg-2 { font-size: 16px; color: rgb(52, 152, 219); } .teg-3 { font-size: 20px; color: rgb(52, 152, 219); } .teg-4 { font-size: 28px; color: rgb(52, 152, 219); } .teg-5 { font-size: 36px; color: rgb(70, 207, 176); }

$(document).ready(function(){ var classes = ["teg-1", "teg-2", "teg-3", "teg-4", "teg-5"]; $("#tegcloud a").each(function(){ $(this).addClass(classes[~~(Math.random()*classes.length)]); }); });