progress bar style : demo 18

HTML5 - 80%
CSS3 - 91%
JavaScript - 79%
jQuery - 60%

HTML

                        
HTML5 - 80%
CSS3 - 91%

CSS

                        .progress_bar {
                            float: left;
                            margin-bottom: 20px;
                            width: 100%;
                        }
                        .progress_bar .progress_bar_title {
                            box-sizing: border-box;
                            color: hsl(0, 0%, 13%);
                            float: left;
                            font-weight: bold;
                            margin-bottom: 5px;
                            padding-left: 5px;
                            width: 100%;
                        }
                        .progress_bar .pro-bar {
                            background-color: hsl(0, 0%, 100%);
                            border: 1px solid hsl(0, 0%, 90%);
                            box-sizing: border-box;
                            float: left;
                            padding: 5px;
                            position: relative;
                            width: 100%;
                        }
                        .progress_bar .pro-bg {
                            background-color: hsl(204, 5%, 20%);
                            float: left;
                            height: 10px;
                            position: relative;
                            width: 100%;
                            z-index: 1;
                        }
                        .progress_bar .progress-bar-inner {
                            float: left;
                            height: 10px;
                            left: 0;
                            margin-top: -10px;
                            position: relative;
                            top: 0;
                            z-index: 100;
                        }
                    
License Terms