Вот код index.html:
Код:
<!DOCTYPE html>
<html>
<head>
<title>Индикатор прогресса на HTML5 и CSS3</title>
<style>
ul { list-style-type: none; display:block; padding-left:0px;}
li { min-height:55px; }
.progress { position:relative; top:8px; width:300px; height:20px; border-radius:20px; border:1px solid #ddd; box-shadow:inset 0px 0px 5px #ddd; }
.bar { z-index:2; position:relative; top:0px; left:0px; height:18px; border-radius:20px; border:1px solid #eee; background: linear-gradient(to bottom, #fb83fa 0%,#e93cec 100%); }
</style>
</head>
<body>
<p><b><u>Знание языков:</u></b></p>
<ul>
<li>Русский<div class="progress"><div class="bar" style="width:99%;"></div></div></li>
<li>Казахский<div class="progress"><div class="bar" style="width:5%;"></div></div></li>
<li>Английский<div class="progress"><div class="bar" style="width:50%;"></div></div></li>
<li>Немецкий<div class="progress"><div class="bar" style="width:70%;"></div></div></li>
<li>Французский<div class="progress"><div class="bar" style="width:5%;"></div></div></li>
</ul>
</body>
</html>Результат: