{"id":1123,"date":"2019-06-02T05:33:14","date_gmt":"2019-06-02T05:33:14","guid":{"rendered":"https:\/\/kapee.presslayouts.com\/dummy\/?page_id=1123"},"modified":"2019-06-02T05:33:14","modified_gmt":"2019-06-02T05:33:14","slug":"progress-bar","status":"publish","type":"page","link":"https:\/\/mammoth.com.hk\/zh\/elements\/progress-bar\/","title":{"rendered":"Progress Bar"},"content":{"rendered":"<div class=\"wpb-content-wrapper\"><div class=\"vc_row wpb_row vc_row-fluid\"><div class=\"wpb_column vc_column_container vc_col-sm-12\"><div class=\"vc_column-inner\"><div class=\"wpb_wrapper\"><div class=\"vc_empty_space\"   style=\"height: 32px\"><span class=\"vc_empty_space_inner\"><\/span><\/div><div id=\"kapee-header-99054\" class=\"kapee-element kapee-heading text-center kapee-width-100 separator-underline separator-between-heading\">\t\n\t\t\t\n\t\t\t<div class=\"heading-wrap\">\n\t\t\t<span class=\"separator-left\"><\/span>\n\t\t\t<h4 class=\"heading-title\">Progressbar Style 1 <\/h4>\t\t\t<span class=\"separator-right\"><\/span>\n\t\t\t\t\t<\/div>\n\t\t\n    <\/div><div class=\"vc_empty_space\"   style=\"height: 32px\"><span class=\"vc_empty_space_inner\"><\/span><\/div><div id=\"kapee-progress-12200\" class=\"kapee-element kapee-progress-bar bar-style-1\">\n\t\t\n\t<div class=\"progress-wrap\">\n\t\t\n\t\t\t<div id=\"bar-0-6ab1ca15bfb6f\" class=\"progress\">\n\t\t\t\t<div class=\"progress-bar\" role=\"progressbar\" data-value=\"95\" aria-valuenow=\"95\" aria-valuemin=\"0\" aria-valuemax=\"100\">\n\t\t\t\t\t<span class=\"bar-label\">Web Developmen<\/span>\n\t\t\t\t\t<span class=\"bar-value\">95%<\/span>\n\t\t\t\t<\/div>\n\t\t\t\t<style>\n\t\t\t\t#bar-0-6ab1ca15bfb6f .progress-bar{background-color : #388e3c;}\t\t\t\t<\/style>\n\t\t\t<\/div>\n\t\t\n\t\t\t<div id=\"bar-1-6ab1ca15bfb75\" class=\"progress\">\n\t\t\t\t<div class=\"progress-bar\" role=\"progressbar\" data-value=\"85\" aria-valuenow=\"85\" aria-valuemin=\"0\" aria-valuemax=\"100\">\n\t\t\t\t\t<span class=\"bar-label\">Design<\/span>\n\t\t\t\t\t<span class=\"bar-value\">85%<\/span>\n\t\t\t\t<\/div>\n\t\t\t\t<style>\n\t\t\t\t#bar-1-6ab1ca15bfb75 .progress-bar{background-color : #ff9f00;}\t\t\t\t<\/style>\n\t\t\t<\/div>\n\t\t\n\t\t\t<div id=\"bar-2-6ab1ca15bfb78\" class=\"progress\">\n\t\t\t\t<div class=\"progress-bar\" role=\"progressbar\" data-value=\"80\" aria-valuenow=\"80\" aria-valuemin=\"0\" aria-valuemax=\"100\">\n\t\t\t\t\t<span class=\"bar-label\">Wordpress<\/span>\n\t\t\t\t\t<span class=\"bar-value\">80%<\/span>\n\t\t\t\t<\/div>\n\t\t\t\t<style>\n\t\t\t\t#bar-2-6ab1ca15bfb78 .progress-bar{background-color : #2370f4;}\t\t\t\t<\/style>\n\t\t\t<\/div>\n\t\t\n\t\t\t<div id=\"bar-3-6ab1ca15bfb7a\" class=\"progress\">\n\t\t\t\t<div class=\"progress-bar\" role=\"progressbar\" data-value=\"75\" aria-valuenow=\"75\" aria-valuemin=\"0\" aria-valuemax=\"100\">\n\t\t\t\t\t<span class=\"bar-label\">Marketing<\/span>\n\t\t\t\t\t<span class=\"bar-value\">75%<\/span>\n\t\t\t\t<\/div>\n\t\t\t\t<style>\n\t\t\t\t#bar-3-6ab1ca15bfb7a .progress-bar{background-color : #ff6161;}\t\t\t\t<\/style>\n\t\t\t<\/div>\n\t\t\t<\/div>\n<\/div><\/div><\/div><\/div><\/div><div data-vc-full-width=\"true\" data-vc-full-width-temp=\"true\" data-vc-full-width-init=\"false\" class=\"vc_row wpb_row vc_row-fluid vc_custom_1559796144320 vc_row-has-fill\"><div class=\"wpb_column vc_column_container vc_col-sm-12\"><div class=\"vc_column-inner\"><div class=\"wpb_wrapper\"><div id=\"kapee-header-33310\" class=\"kapee-element kapee-heading text-center kapee-width-100 separator-underline separator-between-heading\">\t\n\t\t\t\n\t\t\t<div class=\"heading-wrap\">\n\t\t\t<span class=\"separator-left\"><\/span>\n\t\t\t<h4 class=\"heading-title\">Progressbar Style 2 <\/h4>\t\t\t<span class=\"separator-right\"><\/span>\n\t\t\t\t\t<\/div>\n\t\t\n    <\/div><div class=\"vc_empty_space\"   style=\"height: 32px\"><span class=\"vc_empty_space_inner\"><\/span><\/div><div id=\"kapee-progress-34421\" class=\"kapee-element kapee-progress-bar bar-style-2\">\n\t\t\n\t<div class=\"progress-wrap\">\n\t\t\n\t\t\t<div id=\"bar-0-6ab1ca15c0346\" class=\"progress\">\n\t\t\t\t<div class=\"progress-bar\" role=\"progressbar\" data-value=\"95\" aria-valuenow=\"95\" aria-valuemin=\"0\" aria-valuemax=\"100\">\n\t\t\t\t\t<span class=\"bar-label\">Web Developmen<\/span>\n\t\t\t\t\t<span class=\"bar-value\">95%<\/span>\n\t\t\t\t<\/div>\n\t\t\t\t<style>\n\t\t\t\t#bar-0-6ab1ca15c0346 .progress-bar{background-color : #388e3c;}\t\t\t\t<\/style>\n\t\t\t<\/div>\n\t\t\n\t\t\t<div id=\"bar-1-6ab1ca15c034b\" class=\"progress\">\n\t\t\t\t<div class=\"progress-bar\" role=\"progressbar\" data-value=\"85\" aria-valuenow=\"85\" aria-valuemin=\"0\" aria-valuemax=\"100\">\n\t\t\t\t\t<span class=\"bar-label\">Design<\/span>\n\t\t\t\t\t<span class=\"bar-value\">85%<\/span>\n\t\t\t\t<\/div>\n\t\t\t\t<style>\n\t\t\t\t#bar-1-6ab1ca15c034b .progress-bar{background-color : #ff9f00;}\t\t\t\t<\/style>\n\t\t\t<\/div>\n\t\t\n\t\t\t<div id=\"bar-2-6ab1ca15c034e\" class=\"progress\">\n\t\t\t\t<div class=\"progress-bar\" role=\"progressbar\" data-value=\"80\" aria-valuenow=\"80\" aria-valuemin=\"0\" aria-valuemax=\"100\">\n\t\t\t\t\t<span class=\"bar-label\">Wordpress<\/span>\n\t\t\t\t\t<span class=\"bar-value\">80%<\/span>\n\t\t\t\t<\/div>\n\t\t\t\t<style>\n\t\t\t\t#bar-2-6ab1ca15c034e .progress-bar{background-color : #2370f4;}\t\t\t\t<\/style>\n\t\t\t<\/div>\n\t\t\n\t\t\t<div id=\"bar-3-6ab1ca15c0350\" class=\"progress\">\n\t\t\t\t<div class=\"progress-bar\" role=\"progressbar\" data-value=\"75\" aria-valuenow=\"75\" aria-valuemin=\"0\" aria-valuemax=\"100\">\n\t\t\t\t\t<span class=\"bar-label\">Marketing<\/span>\n\t\t\t\t\t<span class=\"bar-value\">75%<\/span>\n\t\t\t\t<\/div>\n\t\t\t\t<style>\n\t\t\t\t#bar-3-6ab1ca15c0350 .progress-bar{background-color : #ff6161;}\t\t\t\t<\/style>\n\t\t\t<\/div>\n\t\t\t<\/div>\n<\/div><\/div><\/div><\/div><\/div><div class=\"vc_row-full-width vc_clearfix\"><\/div><div class=\"vc_row wpb_row vc_row-fluid\"><div class=\"wpb_column vc_column_container vc_col-sm-12\"><div class=\"vc_column-inner\"><div class=\"wpb_wrapper\"><div class=\"vc_empty_space\"   style=\"height: 32px\"><span class=\"vc_empty_space_inner\"><\/span><\/div><div id=\"kapee-header-74305\" class=\"kapee-element kapee-heading text-center kapee-width-100 separator-underline separator-between-heading\">\t\n\t\t\t\n\t\t\t<div class=\"heading-wrap\">\n\t\t\t<span class=\"separator-left\"><\/span>\n\t\t\t<h4 class=\"heading-title\">Progressbar Style 3 <\/h4>\t\t\t<span class=\"separator-right\"><\/span>\n\t\t\t\t\t<\/div>\n\t\t\n    <\/div><div class=\"vc_empty_space\"   style=\"height: 32px\"><span class=\"vc_empty_space_inner\"><\/span><\/div><div id=\"kapee-progress-86226\" class=\"kapee-element kapee-progress-bar bar-style-3\">\n\t\t\n\t<div class=\"progress-wrap\">\n\t\t\n\t\t\t<div id=\"bar-0-6ab1ca15c0c9f\" class=\"progress\">\n\t\t\t\t<div class=\"progress-bar\" role=\"progressbar\" data-value=\"95\" aria-valuenow=\"95\" aria-valuemin=\"0\" aria-valuemax=\"100\">\n\t\t\t\t\t<span class=\"bar-label\">Web Developmen<\/span>\n\t\t\t\t\t<span class=\"bar-value\">95%<\/span>\n\t\t\t\t<\/div>\n\t\t\t\t<style>\n\t\t\t\t#bar-0-6ab1ca15c0c9f .progress-bar{background-color : #388e3c;}\t\t\t\t<\/style>\n\t\t\t<\/div>\n\t\t\n\t\t\t<div id=\"bar-1-6ab1ca15c0ca4\" class=\"progress\">\n\t\t\t\t<div class=\"progress-bar\" role=\"progressbar\" data-value=\"85\" aria-valuenow=\"85\" aria-valuemin=\"0\" aria-valuemax=\"100\">\n\t\t\t\t\t<span class=\"bar-label\">Design<\/span>\n\t\t\t\t\t<span class=\"bar-value\">85%<\/span>\n\t\t\t\t<\/div>\n\t\t\t\t<style>\n\t\t\t\t#bar-1-6ab1ca15c0ca4 .progress-bar{background-color : #ff9f00;}\t\t\t\t<\/style>\n\t\t\t<\/div>\n\t\t\n\t\t\t<div id=\"bar-2-6ab1ca15c0ca7\" class=\"progress\">\n\t\t\t\t<div class=\"progress-bar\" role=\"progressbar\" data-value=\"80\" aria-valuenow=\"80\" aria-valuemin=\"0\" aria-valuemax=\"100\">\n\t\t\t\t\t<span class=\"bar-label\">Wordpress<\/span>\n\t\t\t\t\t<span class=\"bar-value\">80%<\/span>\n\t\t\t\t<\/div>\n\t\t\t\t<style>\n\t\t\t\t#bar-2-6ab1ca15c0ca7 .progress-bar{background-color : #2370f4;}\t\t\t\t<\/style>\n\t\t\t<\/div>\n\t\t\n\t\t\t<div id=\"bar-3-6ab1ca15c0ca9\" class=\"progress\">\n\t\t\t\t<div class=\"progress-bar\" role=\"progressbar\" data-value=\"75\" aria-valuenow=\"75\" aria-valuemin=\"0\" aria-valuemax=\"100\">\n\t\t\t\t\t<span class=\"bar-label\">Marketing<\/span>\n\t\t\t\t\t<span class=\"bar-value\">75%<\/span>\n\t\t\t\t<\/div>\n\t\t\t\t<style>\n\t\t\t\t#bar-3-6ab1ca15c0ca9 .progress-bar{background-color : #ff6161;}\t\t\t\t<\/style>\n\t\t\t<\/div>\n\t\t\t<\/div>\n<\/div><\/div><\/div><\/div><\/div><div data-vc-full-width=\"true\" data-vc-full-width-temp=\"true\" data-vc-full-width-init=\"false\" class=\"vc_row wpb_row vc_row-fluid vc_custom_1559796165057 vc_row-has-fill\"><div class=\"wpb_column vc_column_container vc_col-sm-12\"><div class=\"vc_column-inner\"><div class=\"wpb_wrapper\"><div id=\"kapee-header-24267\" class=\"kapee-element kapee-heading text-center kapee-width-100 separator-underline separator-between-heading\">\t\n\t\t\t\n\t\t\t<div class=\"heading-wrap\">\n\t\t\t<span class=\"separator-left\"><\/span>\n\t\t\t<h4 class=\"heading-title\">Progressbar Style 4 <\/h4>\t\t\t<span class=\"separator-right\"><\/span>\n\t\t\t\t\t<\/div>\n\t\t\n    <\/div><div class=\"vc_empty_space\"   style=\"height: 32px\"><span class=\"vc_empty_space_inner\"><\/span><\/div><div id=\"kapee-progress-86744\" class=\"kapee-element kapee-progress-bar bar-style-1\">\n\t\t\n\t<div class=\"progress-wrap\">\n\t\t\n\t\t\t<div id=\"bar-0-6ab1ca15c1440\" class=\"progress\">\n\t\t\t\t<div class=\"progress-bar progress-bar-striped\" role=\"progressbar\" data-value=\"95\" aria-valuenow=\"95\" aria-valuemin=\"0\" aria-valuemax=\"100\">\n\t\t\t\t\t<span class=\"bar-label\">Web Developmen<\/span>\n\t\t\t\t\t<span class=\"bar-value\">95%<\/span>\n\t\t\t\t<\/div>\n\t\t\t\t<style>\n\t\t\t\t#bar-0-6ab1ca15c1440 .progress-bar{background-color : #388e3c;}\t\t\t\t<\/style>\n\t\t\t<\/div>\n\t\t\n\t\t\t<div id=\"bar-1-6ab1ca15c144f\" class=\"progress\">\n\t\t\t\t<div class=\"progress-bar progress-bar-striped\" role=\"progressbar\" data-value=\"85\" aria-valuenow=\"85\" aria-valuemin=\"0\" aria-valuemax=\"100\">\n\t\t\t\t\t<span class=\"bar-label\">Design<\/span>\n\t\t\t\t\t<span class=\"bar-value\">85%<\/span>\n\t\t\t\t<\/div>\n\t\t\t\t<style>\n\t\t\t\t#bar-1-6ab1ca15c144f .progress-bar{background-color : #ff9f00;}\t\t\t\t<\/style>\n\t\t\t<\/div>\n\t\t\n\t\t\t<div id=\"bar-2-6ab1ca15c1452\" class=\"progress\">\n\t\t\t\t<div class=\"progress-bar progress-bar-striped\" role=\"progressbar\" data-value=\"80\" aria-valuenow=\"80\" aria-valuemin=\"0\" aria-valuemax=\"100\">\n\t\t\t\t\t<span class=\"bar-label\">Wordpress<\/span>\n\t\t\t\t\t<span class=\"bar-value\">80%<\/span>\n\t\t\t\t<\/div>\n\t\t\t\t<style>\n\t\t\t\t#bar-2-6ab1ca15c1452 .progress-bar{background-color : #2370f4;}\t\t\t\t<\/style>\n\t\t\t<\/div>\n\t\t\n\t\t\t<div id=\"bar-3-6ab1ca15c1454\" class=\"progress\">\n\t\t\t\t<div class=\"progress-bar progress-bar-striped\" role=\"progressbar\" data-value=\"75\" aria-valuenow=\"75\" aria-valuemin=\"0\" aria-valuemax=\"100\">\n\t\t\t\t\t<span class=\"bar-label\">Marketing<\/span>\n\t\t\t\t\t<span class=\"bar-value\">75%<\/span>\n\t\t\t\t<\/div>\n\t\t\t\t<style>\n\t\t\t\t#bar-3-6ab1ca15c1454 .progress-bar{background-color : #ff6161;}\t\t\t\t<\/style>\n\t\t\t<\/div>\n\t\t\t<\/div>\n<\/div><\/div><\/div><\/div><\/div><div class=\"vc_row-full-width vc_clearfix\"><\/div><div class=\"vc_row wpb_row vc_row-fluid\"><div class=\"wpb_column vc_column_container vc_col-sm-12\"><div class=\"vc_column-inner\"><div class=\"wpb_wrapper\"><div class=\"vc_empty_space\"   style=\"height: 32px\"><span class=\"vc_empty_space_inner\"><\/span><\/div><div id=\"kapee-header-90459\" class=\"kapee-element kapee-heading text-center kapee-width-100 separator-underline separator-between-heading\">\t\n\t\t\t\n\t\t\t<div class=\"heading-wrap\">\n\t\t\t<span class=\"separator-left\"><\/span>\n\t\t\t<h4 class=\"heading-title\">Progressbar Style 5 <\/h4>\t\t\t<span class=\"separator-right\"><\/span>\n\t\t\t\t\t<\/div>\n\t\t\n    <\/div><div class=\"vc_empty_space\"   style=\"height: 32px\"><span class=\"vc_empty_space_inner\"><\/span><\/div><div id=\"kapee-progress-84159\" class=\"kapee-element kapee-progress-bar bar-style-1\">\n\t\t\n\t<div class=\"progress-wrap\">\n\t\t\n\t\t\t<div id=\"bar-0-6ab1ca15c1d8a\" class=\"progress\">\n\t\t\t\t<div class=\"progress-bar progress-bar-striped progress-bar-animated\" role=\"progressbar\" data-value=\"95\" aria-valuenow=\"95\" aria-valuemin=\"0\" aria-valuemax=\"100\">\n\t\t\t\t\t<span class=\"bar-label\">Web Developmen<\/span>\n\t\t\t\t\t<span class=\"bar-value\">95%<\/span>\n\t\t\t\t<\/div>\n\t\t\t\t<style>\n\t\t\t\t#bar-0-6ab1ca15c1d8a .progress-bar{background-color : #388e3c;}\t\t\t\t<\/style>\n\t\t\t<\/div>\n\t\t\n\t\t\t<div id=\"bar-1-6ab1ca15c1d8f\" class=\"progress\">\n\t\t\t\t<div class=\"progress-bar progress-bar-striped progress-bar-animated\" role=\"progressbar\" data-value=\"85\" aria-valuenow=\"85\" aria-valuemin=\"0\" aria-valuemax=\"100\">\n\t\t\t\t\t<span class=\"bar-label\">Design<\/span>\n\t\t\t\t\t<span class=\"bar-value\">85%<\/span>\n\t\t\t\t<\/div>\n\t\t\t\t<style>\n\t\t\t\t#bar-1-6ab1ca15c1d8f .progress-bar{background-color : #ff9f00;}\t\t\t\t<\/style>\n\t\t\t<\/div>\n\t\t\n\t\t\t<div id=\"bar-2-6ab1ca15c1d92\" class=\"progress\">\n\t\t\t\t<div class=\"progress-bar progress-bar-striped progress-bar-animated\" role=\"progressbar\" data-value=\"80\" aria-valuenow=\"80\" aria-valuemin=\"0\" aria-valuemax=\"100\">\n\t\t\t\t\t<span class=\"bar-label\">Wordpress<\/span>\n\t\t\t\t\t<span class=\"bar-value\">80%<\/span>\n\t\t\t\t<\/div>\n\t\t\t\t<style>\n\t\t\t\t#bar-2-6ab1ca15c1d92 .progress-bar{background-color : #2370f4;}\t\t\t\t<\/style>\n\t\t\t<\/div>\n\t\t\n\t\t\t<div id=\"bar-3-6ab1ca15c1d94\" class=\"progress\">\n\t\t\t\t<div class=\"progress-bar progress-bar-striped progress-bar-animated\" role=\"progressbar\" data-value=\"75\" aria-valuenow=\"75\" aria-valuemin=\"0\" aria-valuemax=\"100\">\n\t\t\t\t\t<span class=\"bar-label\">Marketing<\/span>\n\t\t\t\t\t<span class=\"bar-value\">75%<\/span>\n\t\t\t\t<\/div>\n\t\t\t\t<style>\n\t\t\t\t#bar-3-6ab1ca15c1d94 .progress-bar{background-color : #ff6161;}\t\t\t\t<\/style>\n\t\t\t<\/div>\n\t\t\t<\/div>\n<\/div><\/div><\/div><\/div><\/div>\n<\/div>","protected":false},"excerpt":{"rendered":"Progressbar Style 1 Web Developmen 95% Design 85% Wordpress 80% Marketing 75% Progressbar Style 2 Web Developmen 95% Design 85% Wordpress 80% Marketing 75% Progressbar Style 3 Web Developmen 95%","protected":false},"author":1,"featured_media":0,"parent":1040,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-1123","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/mammoth.com.hk\/zh\/wp-json\/wp\/v2\/pages\/1123","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/mammoth.com.hk\/zh\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/mammoth.com.hk\/zh\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/mammoth.com.hk\/zh\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/mammoth.com.hk\/zh\/wp-json\/wp\/v2\/comments?post=1123"}],"version-history":[{"count":0,"href":"https:\/\/mammoth.com.hk\/zh\/wp-json\/wp\/v2\/pages\/1123\/revisions"}],"up":[{"embeddable":true,"href":"https:\/\/mammoth.com.hk\/zh\/wp-json\/wp\/v2\/pages\/1040"}],"wp:attachment":[{"href":"https:\/\/mammoth.com.hk\/zh\/wp-json\/wp\/v2\/media?parent=1123"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}