* {  
  padding:0px;  
  margin:0px;  
  }  
  .center {  
  width:60%;  
  margin:20px auto 0 auto  
  }  
  .marginbot {  
  margin-bottom:15px  
  }  
  ul.list li {  
  list-style-type:none;  
  margin-left:20px  
  }  
  ul.tabs {  
  width:100%;  
  overflow:hidden  
  }  
  ul.tabs li {  
  list-style-type:none;  
  display:block;  
  float:left;  
  color:#fff;  
  padding:8px;  
  margin-right:2px;  
  border-bottom:2px solid #2f2f2f;  
  background-color:#1f5e6f;  
  -moz-border-radius:4px 4px 0 0;  
  -webkit-border-radius:4px 4px 0 0;  
  cursor:pointer  
  }  
  ul.tabs li:hover {  
  background-color:#43b0ce  
  }  
  ul.tabs li.current {  
  border-bottom:2px solid #43b0ce;  
  background-color:#43b0ce;  
  padding:8px  
  }  
  .tabscontent {  
  border-top:2px solid #43b0ce;  
  padding:8px 0 0 0;  
  display:none;  
  width:100%;  
  text-align:justify  
  }

<div id="tabsholder">  
  <ul class="tabs">  
  <li id="tab1">Вкладка 1</li>  
  <li id="tab2">Вкладка 2</li>  
  <li id="tab3">Вкладка 3</li>  
  <li id="tab4">Вкладка 4</li>  
  </ul>  
  <div class="contents marginbot">  
  <div id="content1" class="tabscontent">Это супермодный мегаприятный для чтения и восприятия текст</div>  
  <div id="content2" class="tabscontent">Это супермодный мегаприятный для чтения и восприятия текс 2</div>  
  <div id="content3" class="tabscontent">Это супермодный мегаприятный для чтения и восприятия текст 3</div>  
  <div id="content4" class="tabscontent">Это супермодный мегаприятный для чтения и восприятия текст 4</div>  
  </div>  
  </div>  
  <script>  
  (function ($) {  
  $.fn.tytabs = function (options) {  
  var defaults = {  
  prefixtabs: "tab",  
  prefixcontent: "content",  
  classcontent: "tabscontent",  
  tabinit: "1",  
  catchget: "tab",  
  fadespeed: "normal"  
  }, opts = $.extend({}, defaults, options);  
  return this.each(function () {  
  var obj = $(this);  
  opts.classcontent = "." + opts.classcontent;  
  opts.prefixcontent = "#" + opts.prefixcontent;  

  function showTab(id) {  
  $(opts.classcontent, obj).stop(true, true);  
  var contentvisible = $(opts.classcontent + ":visible", obj);  
  if (contentvisible.length > 0) {  
  contentvisible.fadeOut(opts.fadespeed, function () {  
  fadeincontent(id)  
  })  
  } else {  
  fadeincontent(id)  
  }  
  $("#" + opts.prefixtabs + opts.tabinit).removeAttr("class");  
  $("#" + opts.prefixtabs + id).attr("class", "current");  
  opts.tabinit = id  
  }  

  function fadeincontent(id) {  
  $(opts.prefixcontent + id, obj).fadeIn(opts.fadespeed)  
  }  
  $("ul.tabs li", obj).click(function () {  
  showTab($(this).attr("id").replace(opts.prefixtabs, ""));  
  return false  
  });  
  var tab = getvars(opts.catchget);  
  showTab(((tab && $(opts.prefixcontent + tab).length == 1) ? tab : ($(opts.prefixcontent + opts.tabinit).length == 1) ? opts.tabinit : "1"))  
  })  
  };  

  function getvars(q, s) {  
  s = (s) ? s : window.location.search;  
  var re = new RegExp("&" + q + "=([^&]*)", "i");  
  return (s = s.replace(/^\?/, "&").match(re)) ? s = s[1] : s = ""  
  }  
  })(jQuery);  

  $(document).ready(function () {  
  $("#tabsholder").tytabs({  
  tabinit: "1", // Какая вкладка активна по-умолчанию  
  fadespeed: "normal" // Скорость анимации (fast, normal, slow)  
  })  
  })  
  </script>