{"id":85110,"date":"2025-03-27T16:45:48","date_gmt":"2025-03-27T09:45:48","guid":{"rendered":"https:\/\/itviecblog.uptech.vn\/?p=85110"},"modified":"2025-07-10T10:56:37","modified_gmt":"2025-07-10T03:56:37","slug":"bootstrap-la-gi","status":"publish","type":"post","link":"https:\/\/itviec.com\/blog\/bootstrap-la-gi\/","title":{"rendered":"Bootstrap l\u00e0 g\u00ec? 7 t\u00ednh n\u0103ng c\u1ea7n bi\u1ebft trong Bootstrap"},"content":{"rendered":"<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_85 counter-hierarchy ez-toc-counter ez-toc-grey ez-toc-container-direction\">\n<div class=\"ez-toc-title-container\">\n<p class=\"ez-toc-title\" style=\"cursor:inherit\">N\u1ed9i dung b\u00e0i vi\u1ebft<\/p>\n<span class=\"ez-toc-title-toggle\"><a href=\"#\" class=\"ez-toc-pull-right ez-toc-btn ez-toc-btn-xs ez-toc-btn-default ez-toc-toggle\" aria-label=\"Toggle Table of Content\"><span class=\"ez-toc-js-icon-con\"><span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #999;color:#999\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #999;color:#999\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span><\/span><\/a><\/span><\/div>\n<nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/itviec.com\/blog\/bootstrap-la-gi\/#Gioi_thieu_chung_ve_Bootstrap\" >Gi\u1edbi thi\u1ec7u chung v\u1ec1 Bootstrap<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/itviec.com\/blog\/bootstrap-la-gi\/#Uu_diem_va_nhuoc_diem_cua_Bootstrap_la_gi\" >\u01afu \u0111i\u1ec3m v\u00e0 nh\u01b0\u1ee3c \u0111i\u1ec3m c\u1ee7a Bootstrap l\u00e0 g\u00ec?<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/itviec.com\/blog\/bootstrap-la-gi\/#Cac_tinh_nang_chinh_trong_Bootstrap_la_gi\" >C\u00e1c t\u00ednh n\u0103ng ch\u00ednh trong Bootstrap l\u00e0 g\u00ec?<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/itviec.com\/blog\/bootstrap-la-gi\/#Huong_dan_cai_dat_Bootstrap\" >H\u01b0\u1edbng d\u1eabn c\u00e0i \u0111\u1eb7t Bootstrap<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/itviec.com\/blog\/bootstrap-la-gi\/#Vi_du_ve_cach_su_dung_Bootstrap\" >V\u00ed d\u1ee5 v\u1ec1 c\u00e1ch s\u1eed d\u1ee5ng Bootstrap<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/itviec.com\/blog\/bootstrap-la-gi\/#So_sanh_Bootstrap_voi_cac_framework_khac\" >So s\u00e1nh Bootstrap v\u1edbi c\u00e1c framework kh\u00e1c<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-7\" href=\"https:\/\/itviec.com\/blog\/bootstrap-la-gi\/#Cau_hoi_thuong_gap_ve_Bootstrap_la_gi\" >C\u00e2u h\u1ecfi th\u01b0\u1eddng g\u1eb7p v\u1ec1 Bootstrap l\u00e0 g\u00ec<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-8\" href=\"https:\/\/itviec.com\/blog\/bootstrap-la-gi\/#Tong_ket_Bootstrap_la_gi\" >T\u1ed5ng k\u1ebft Bootstrap l\u00e0 g\u00ec<\/a><\/li><\/ul><\/nav><\/div>\n\n<p><em><strong>Trong l\u0129nh v\u1ef1c ph\u00e1t tri\u1ec3n ph\u1ea7n m\u1ec1m ng\u00e0y nay, vi\u1ec7c t\u1ea1o ra nh\u1eefng giao di\u1ec7n web \u0111\u1eb9p m\u1eaft, chuy\u00ean nghi\u1ec7p, t\u1ea1o s\u1ef1 thu\u1eadn ti\u1ec7n cho ng\u01b0\u1eddi d\u00f9ng l\u00e0 \u0111i\u1ec1u v\u00f4 c\u00f9ng quan tr\u1ecdng. Bootstrap ch\u00ednh l\u00e0 m\u1ed9t trong nh\u1eefng c\u00f4ng c\u1ee5 h\u1eefu \u00edch gi\u00fap c\u00e1c l\u1eadp tr\u00ecnh vi\u00ean l\u00e0m \u0111\u01b0\u1ee3c \u0111i\u1ec1u \u0111\u00f3. V\u1eady th\u00ec Bootstrap l\u00e0 g\u00ec v\u00e0 v\u00ec sao Frontend Developer n\u00ean quan t\u00e2m \u0111\u1ebfn Bootstrap?<\/strong><\/em><\/p>\n\n\n\n<p><span style=\"font-weight: 400;\">\u0110\u1ecdc b\u00e0i vi\u1ebft n\u00e0y \u0111\u1ec3 hi\u1ec3u r\u00f5 h\u01a1n v\u1ec1:<\/span><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><span style=\"font-weight: 400;\">Bootstrap l\u00e0 g\u00ec?<\/span><\/li>\n\n\n\n<li><span style=\"font-weight: 400;\">L\u1ecbch s\u1eed h\u00ecnh th\u00e0nh v\u00e0 ph\u00e1t tri\u1ec3n c\u1ee7a Bootstrap<\/span><\/li>\n\n\n\n<li><span style=\"font-weight: 400;\">C\u00e1c t\u00ednh n\u0103ng ch\u00ednh c\u1ee7a Bootstrap<\/span><\/li>\n\n\n\n<li><span style=\"font-weight: 400;\">C\u00e1ch c\u00e0i \u0111\u1eb7t v\u00e0 \u1ee9ng d\u1ee5ng Bootstrap v\u00e0o d\u1ef1 \u00e1n c\u1ee7a b\u1ea1n<\/span><\/li>\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-gi\u1edbi-thi\u1ec7u-chung-v\u1ec1-bootstrap\"><span class=\"ez-toc-section\" id=\"Gioi_thieu_chung_ve_Bootstrap\"><\/span><b>Gi\u1edbi thi\u1ec7u chung v\u1ec1 Bootstrap<\/b><span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-bootstrap-la-gi\"><b>Bootstrap l\u00e0 g\u00ec?<\/b><\/h3>\n\n\n\n<p><span style=\"font-weight: 400;\">Bootstrap l\u00e0 m\u1ed9t <a href=\"\/blog\/front-end-framework-library\/\" target=\"_blank\" rel=\"noopener\"><strong>framework front-end<\/strong><\/a> ph\u1ed5 bi\u1ebfn, gi\u00fap x\u00e2y d\u1ef1ng c\u00e1c trang web responsive v\u00e0 t\u1ed1i \u01b0u h\u00f3a cho thi\u1ebft b\u1ecb di \u0111\u1ed9ng. N\u00f3 cung c\u1ea5p s\u1eb5n c\u00e1c th\u00e0nh ph\u1ea7n CSS, JavaScript v\u00e0 c\u00e1c l\u1edbp ti\u1ec7n \u00edch, cho ph\u00e9p t\u1ea1o giao di\u1ec7n ng\u01b0\u1eddi d\u00f9ng hi\u1ec7n \u0111\u1ea1i v\u00e0 \u0111\u1ed3ng nh\u1ea5t m\u1ed9t c\u00e1ch nhanh ch\u00f3ng:<\/span><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><span style=\"font-weight: 400;\">H\u1ec7 th\u1ed1ng l\u01b0\u1edbi responsive linh ho\u1ea1t, h\u1ed7 tr\u1ee3 thi\u1ebft k\u1ebf \u01b0u ti\u00ean tr\u00ean thi\u1ebft b\u1ecb di \u0111\u1ed9ng<\/span><\/li>\n\n\n\n<li><span style=\"font-weight: 400;\">Cung c\u1ea5p \u0111a d\u1ea1ng c\u00e1c th\u00e0nh ph\u1ea7n UI nh\u01b0 n\u00fat b\u1ea5m, modal v\u00e0 thanh \u0111i\u1ec1u h\u01b0\u1edbng<\/span><\/li>\n\n\n\n<li><span style=\"font-weight: 400;\">T\u00edch h\u1ee3p s\u1eb5n c\u00e1c ti\u1ec7n \u00edch gi\u00fap t\u1ed1i \u01b0u ki\u1ec3u ch\u1eef, kho\u1ea3ng c\u00e1ch v\u00e0 kh\u1ea3 n\u0103ng hi\u1ec3n th\u1ecb responsive<\/span><\/li>\n\n\n\n<li><span style=\"font-weight: 400;\">Cho ph\u00e9p t\u00f9y ch\u1ec9nh linh ho\u1ea1t th\u00f4ng qua c\u00e1c bi\u1ebfn Sass v\u00e0 c\u1ea5u h\u00ecnh c\u1ee7a Bootstrap<\/span><\/li>\n<\/ul>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-l\u1ecbch-s\u1eed-hinh-thanh-va-phat-tri\u1ec3n\"><b>L\u1ecbch s\u1eed h\u00ecnh th\u00e0nh v\u00e0 ph\u00e1t tri\u1ec3n<\/b><\/h3>\n\n\n\n<p><span style=\"font-weight: 400;\">Bootstrap \u0111\u01b0\u1ee3c ph\u00e1t tri\u1ec3n t\u1ea1i Twitter v\u00e0o gi\u1eefa n\u0103m 2010 b\u1edfi <\/span><a href=\"https:\/\/x.com\/mdo\" target=\"_blank\" rel=\"noopener\"><span style=\"font-weight: 400;\">Mark Otto<\/span><\/a><span style=\"font-weight: 400;\"> v\u00e0 <\/span><a href=\"https:\/\/x.com\/fat\" target=\"_blank\" rel=\"noopener\"><span style=\"font-weight: 400;\">Jacob Thornton<\/span><\/a><span style=\"font-weight: 400;\"> v\u1edbi t\u00ean g\u1ecdi Twitter Blueprint, m\u1ed9t c\u00f4ng c\u1ee5 n\u1ed9i b\u1ed9 \u0111\u1ec3 x\u00e2y d\u1ef1ng giao di\u1ec7n ng\u01b0\u1eddi d\u00f9ng nh\u1ea5t qu\u00e1n v\u00e0 hi\u1ec7u qu\u1ea3.<\/span><\/p>\n\n\n\n<p><span style=\"font-weight: 400;\">Bootstrap ch\u00ednh th\u1ee9c ra m\u1eaft v\u00e0o ng\u00e0y 19\/8\/ 2011. K\u1ec3 t\u1eeb \u0111\u00f3, framework n\u00e0y \u0111\u00e3 c\u00f3 h\u01a1n 20 b\u1ea3n ph\u00e1t h\u00e0nh, bao g\u1ed3m hai l\u1ea7n \u0111\u1ea1i tu l\u1edbn v\u1edbi phi\u00ean b\u1ea3n 2 v\u00e0 3:<\/span><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><span style=\"font-weight: 400;\">Bootstrap 2 (2012): T\u00ednh n\u0103ng responsive \u0111\u01b0\u1ee3c b\u1ed5 sung nh\u01b0 m\u1ed9t stylesheet t\u00f9y ch\u1ecdn, cho ph\u00e9p c\u00e1c trang web th\u00edch \u1ee9ng linh ho\u1ea1t v\u1edbi nhi\u1ec1u k\u00edch th\u01b0\u1edbc m\u00e0n h\u00ecnh kh\u00e1c nhau.<\/span><\/li>\n\n\n\n<li><span style=\"font-weight: 400;\">Bootstrap 3 (2013): Bootstrap \u0111\u01b0\u1ee3c vi\u1ebft l\u1ea1i ho\u00e0n to\u00e0n \u0111\u1ec3 tr\u1edf th\u00e0nh m\u1ed9t framework responsive m\u1eb7c \u0111\u1ecbnh, \u00e1p d\u1ee5ng tri\u1ec7t \u0111\u1ec3 ph\u01b0\u01a1ng ph\u00e1p ti\u1ebfp c\u1eadn \u201cmobile-first\u201d.<\/span><\/li>\n\n\n\n<li><span style=\"font-weight: 400;\">Bootstrap 5 (2021): Lo\u1ea1i b\u1ecf jQuery, t\u1eadp trung v\u00e0o JavaScript thu\u1ea7n t\u00fay, n\u00e2ng cao hi\u1ec7u su\u1ea5t v\u00e0 gi\u1ea3m thi\u1ec3u k\u00edch th\u01b0\u1edbc t\u1ec7p. H\u1ec7 th\u1ed1ng l\u01b0\u1edbi (grid system) \u0111\u01b0\u1ee3c c\u1ea3i ti\u1ebfn, c\u00e1c th\u00e0nh ph\u1ea7n (component) \u0111\u01b0\u1ee3c l\u00e0m m\u1edbi v\u00e0 kh\u1ea3 n\u0103ng t\u00f9y ch\u1ec9nh (customization) linh ho\u1ea1t h\u01a1n.<\/span><\/li>\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-\u01b0u-di\u1ec3m-va-nh\u01b0\u1ee3c-di\u1ec3m-c\u1ee7a-bootstrap-la-gi\"><span class=\"ez-toc-section\" id=\"Uu_diem_va_nhuoc_diem_cua_Bootstrap_la_gi\"><\/span><b>\u01afu \u0111i\u1ec3m v\u00e0 nh\u01b0\u1ee3c \u0111i\u1ec3m c\u1ee7a Bootstrap l\u00e0 g\u00ec?<\/b><span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-\u01b0u-di\u1ec3m-bootstrap\"><b>\u01afu \u0111i\u1ec3m Bootstrap<\/b><\/h3>\n\n\n\n<ul class=\"wp-block-list\">\n<li><b>D\u1ec5 h\u1ecdc, d\u1ec5 s\u1eed d\u1ee5ng: <\/b><span style=\"font-weight: 400;\">C\u00fa ph\u00e1p \u0111\u01a1n gi\u1ea3n, d\u1ec5 ti\u1ebfp c\u1eadn, ph\u00f9 h\u1ee3p cho c\u1ea3 ng\u01b0\u1eddi m\u1edbi b\u1eaft \u0111\u1ea7u l\u1eabn l\u1eadp tr\u00ecnh vi\u00ean c\u00f3 kinh nghi\u1ec7m.<\/span><\/li>\n\n\n\n<li><b>Ti\u1ebft ki\u1ec7m th\u1eddi gian ph\u00e1t tri\u1ec3n: <\/b><span style=\"font-weight: 400;\">C\u00e1c th\u00e0nh ph\u1ea7n c\u00f3 s\u1eb5n c\u1ee7a Bootstrap (buttons, thanh \u0111i\u1ec1u h\u01b0\u1edbng, form,..) gi\u00fap t\u0103ng t\u1ed1c qu\u00e1 tr\u00ecnh ph\u00e1t tri\u1ec3n, cho ph\u00e9p ho\u00e0n th\u00e0nh d\u1ef1 \u00e1n nhanh h\u01a1n.<\/span><\/li>\n\n\n\n<li><b>Thi\u1ebft k\u1ebf Responsive: <\/b><span style=\"font-weight: 400;\">H\u1ed7 tr\u1ee3 hi\u1ec3n th\u1ecb t\u1ed1t tr\u00ean m\u1ecdi lo\u1ea1i thi\u1ebft b\u1ecb (PC, tablet, \u0111i\u1ec7n tho\u1ea1i) m\u00e0 kh\u00f4ng c\u1ea7n ch\u1ec9nh s\u1eeda nhi\u1ec1u.<\/span><\/li>\n\n\n\n<li><b>T\u00ednh nh\u1ea5t qu\u00e1n cao: <\/b><span style=\"font-weight: 400;\">C\u00e1c th\u00e0nh ph\u1ea7n UI \u0111\u01b0\u1ee3c \u0111\u1ecbnh d\u1ea1ng s\u1eb5n v\u1edbi phong c\u00e1ch \u0111\u1ed3ng nh\u1ea5t, gi\u00fap giao di\u1ec7n chuy\u00ean nghi\u1ec7p h\u01a1n.<\/span><\/li>\n\n\n\n<li><b>Linh ho\u1ea1t v\u00e0 d\u1ec5 t\u00f9y ch\u1ec9nh: <\/b><span style=\"font-weight: 400;\">C\u00f3 th\u1ec3 t\u00f9y ch\u1ec9nh qua bi\u1ebfn Sass ho\u1eb7c ch\u1ec9nh tr\u1ef1c ti\u1ebfp CSS \u0111\u1ec3 ph\u00f9 h\u1ee3p v\u1edbi nhu c\u1ea7u thi\u1ebft k\u1ebf.<\/span><\/li>\n\n\n\n<li><b>T\u00edch h\u1ee3p t\u1ed1t v\u1edbi JavaScript frameworks: <\/b><span style=\"font-weight: 400;\">D\u1ec5 d\u00e0ng s\u1eed d\u1ee5ng v\u1edbi c\u00e1c framework hi\u1ec7n \u0111\u1ea1i nh\u01b0 React, Angular, Vue.js.<\/span><\/li>\n\n\n\n<li><b>C\u1ed9ng \u0111\u1ed3ng l\u1edbn, t\u00e0i li\u1ec7u phong ph\u00fa: <\/b><span style=\"font-weight: 400;\">Bootstrap l\u00e0 m\u00e3 ngu\u1ed3n m\u1edf mi\u1ec5n ph\u00ed, c\u00f3 c\u1ed9ng \u0111\u1ed3ng h\u1ed7 tr\u1ee3 c\u1ef1c k\u1ef3 l\u1edbn v\u00e0 ngu\u1ed3n t\u00e0i li\u1ec7u \u0111a d\u1ea1ng.<\/span><\/li>\n<\/ul>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-nh\u01b0\u1ee3c-di\u1ec3m-bootstrap\"><b>Nh\u01b0\u1ee3c \u0111i\u1ec3m Bootstrap<\/b><\/h3>\n\n\n\n<ul class=\"wp-block-list\">\n<li><b>Giao di\u1ec7n tr\u00f9ng l\u1eb7p, r\u1eadp khu\u00f4n: <\/b><span style=\"font-weight: 400;\">V\u00ec c\u00e1c \u0111\u1ecbnh d\u1ea1ng m\u1eb7c \u0111\u1ecbnh c\u1ee7a Bootstrap \u0111\u1ec1u \u0111\u1ed3ng nh\u1ea5t, n\u00ean nhi\u1ec1u trang web s\u1eed d\u1ee5ng Bootstrap m\u1eb7c \u0111\u1ecbnh, giao di\u1ec7n c\u00f3 th\u1ec3 thi\u1ebfu s\u1ef1 kh\u00e1c bi\u1ec7t n\u1ebfu kh\u00f4ng t\u00f9y ch\u1ec9nh.<\/span><\/li>\n\n\n\n<li><b>K\u00edch th\u01b0\u1edbc t\u1eadp tin l\u1edbn, chi\u1ebfm nhi\u1ec1u dung l\u01b0\u1ee3ng:<\/b><span style=\"font-weight: 400;\"> Bootstrap bao g\u1ed3m m\u1ed9t l\u01b0\u1ee3ng l\u1edbn CSS v\u00e0 JavaScript, trong \u0111\u00f3 c\u00f3 nhi\u1ec1u ph\u1ea7n c\u00f3 th\u1ec3 kh\u00f4ng c\u1ea7n thi\u1ebft cho m\u1ecdi d\u1ef1 \u00e1n. \u0110i\u1ec1u n\u00e0y d\u1eabn \u0111\u1ebfn vi\u1ec7c t\u1ea3i nhi\u1ec1u t\u00e0i nguy\u00ean kh\u00f4ng c\u1ea7n thi\u1ebft.<\/span><\/li>\n\n\n\n<li><b>Ph\u1ee5 thu\u1ed9c nhi\u1ec1u v\u00e0o c\u00e1c Class: <\/b><span style=\"font-weight: 400;\">Bootstrap cung c\u1ea5p nhi\u1ec1u class \u0111\u01b0\u1ee3c \u0111\u1ecbnh ngh\u0129a s\u1eb5n \u0111\u1ec3 h\u1ed7 tr\u1ee3 vi\u1ec7c ph\u00e1t tri\u1ec3n nhanh ch\u00f3ng. Tuy nhi\u00ean khi c\u1ea7n thay \u0111\u1ed5i, ng\u01b0\u1eddi d\u00f9ng c\u00f3 th\u1ec3 g\u1eb7p kh\u00f3 kh\u0103n v\u00ec ph\u1ea3i ghi \u0111\u00e8 nhi\u1ec1u quy t\u1eafc c\u00f3 s\u1eb5n.<\/span><\/li>\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-cac-tinh-nang-chinh-trong-bootstrap-la-gi\"><span class=\"ez-toc-section\" id=\"Cac_tinh_nang_chinh_trong_Bootstrap_la_gi\"><\/span><b>C\u00e1c t\u00ednh n\u0103ng ch\u00ednh trong Bootstrap l\u00e0 g\u00ec?<\/b><span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-grid-system\"><b>Grid System<\/b><\/h3>\n\n\n\n<p><span style=\"font-weight: 400;\">H\u1ec7 th\u1ed1ng l\u01b0\u1edbi (Grid system) c\u1ee7a Bootstrap cho ph\u00e9p b\u1ea1n chia b\u1ed1 c\u1ee5c th\u00e0nh t\u1ed1i \u0111a 12 c\u1ed9t tr\u00ean m\u1ed9t trang. B\u1ea1n c\u00f3 th\u1ec3 s\u1eed d\u1ee5ng t\u1eebng c\u1ed9t ri\u00eang l\u1ebb ho\u1eb7c k\u1ebft h\u1ee3p ch\u00fang \u0111\u1ec3 t\u1ea1o th\u00e0nh c\u00e1c c\u1ed9t l\u1edbn h\u01a1n. C\u00e1c c\u1ed9t c\u00f3 th\u1ec3 \u0111\u01b0\u1ee3c chia theo b\u1ea5t k\u1ef3 t\u1ed5 h\u1ee3p n\u00e0o mi\u1ec5n l\u00e0 t\u1ed5ng s\u1ed1 c\u1ed9t kh\u00f4ng v\u01b0\u1ee3t qu\u00e1 12.<\/span><\/p>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"1244\" height=\"506\" src=\"\/blog\/wp-content\/uploads\/2025\/03\/Bootstrap-grid-system-vippro.png\" alt=\"bootstrap - itviec blog\" class=\"wp-image-85135\" srcset=\"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/03\/Bootstrap-grid-system-vippro.png 1244w, https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/03\/Bootstrap-grid-system-vippro-300x122.png 300w, https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/03\/Bootstrap-grid-system-vippro-768x312.png 640w, https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/03\/Bootstrap-grid-system-vippro-200x81.png 200w\" sizes=\"auto, (max-width: 1244px) 100vw, 1244px\" \/><\/figure>\n\n\n\n<p><em><span style=\"font-weight: 400;\">C\u1ea5u tr\u00fac c\u1ee7a Grid System.<\/span><\/em><\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-forms\"><b>Forms<\/b><\/h3>\n\n\n\n<p><span style=\"font-weight: 400;\">Bootstrap cung c\u1ea5p m\u1ed9t b\u1ed9 s\u01b0u t\u1eadp phong ph\u00fa c\u00e1c m\u1eabu thi\u1ebft k\u1ebf s\u1eb5n c\u1ee7a c\u00e1c th\u00e0nh ph\u1ea7n trong m\u1ed9t form nh\u01b0 input, textarea, checkbox, select,&#8230; Ch\u00fang \u0111\u01b0\u1ee3c thi\u1ebft k\u1ebf s\u1eb5n v\u1ec1 \u0111\u1ecbnh d\u1ea1ng hi\u1ec3n th\u1ecb, responsive, h\u00e0nh vi r\u00e0ng bu\u1ed9c d\u1eef li\u1ec7u v\u00e0 c\u00f3 th\u1ec3 d\u1ec5 d\u00e0ng t\u00f9y ch\u1ec9nh theo \u00fd mu\u1ed1n.<\/span><\/p>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"2250\" height=\"720\" src=\"\/blog\/wp-content\/uploads\/2025\/03\/bootstrap-forms-vippro.png\" alt=\"bootstrap - forms - itviec blog\" class=\"wp-image-85134\" srcset=\"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/03\/bootstrap-forms-vippro.png 2250w, https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/03\/bootstrap-forms-vippro-300x96.png 300w, https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/03\/bootstrap-forms-vippro-2048x655.png 640w, https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/03\/bootstrap-forms-vippro-200x64.png 200w\" sizes=\"auto, (max-width: 2250px) 100vw, 2250px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-buttons\"><b>Buttons<\/b><\/h3>\n\n\n\n<p><span style=\"font-weight: 400;\">C\u00e1c n\u00fat b\u1ea5m (buttons) trong Bootstrap gi\u00fap t\u1ea1o ra c\u00e1c n\u00fat \u0111\u1ed3ng nh\u1ea5t v\u00e0 responsive m\u1ed9t c\u00e1ch nhanh ch\u00f3ng, b\u1eb1ng c\u00e1ch s\u1eed d\u1ee5ng c\u00e1c l\u1edbp \u0111\u01b0\u1ee3c \u0111\u1ecbnh ngh\u0129a s\u1eb5n. N\u00fat b\u1ea5m c\u00f3 nhi\u1ec1u tr\u1ea1ng th\u00e1i v\u00e0 ki\u1ec3u d\u00e1ng kh\u00e1c nhau.<\/span><\/p>\n\n\n\n<p><span style=\"font-weight: 400;\">T\u1ea1o n\u00fat b\u1ea5m b\u1eb1ng c\u00e1ch s\u1eed d\u1ee5ng th\u1ebb &lt;a&gt; v\u1edbi c\u00e1c CSS class c\u1ee7a Bootstrap ho\u1eb7c s\u1eed d\u1ee5ng th\u1ebb &lt;button&gt;.<\/span><\/p>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"1548\" height=\"172\" src=\"\/blog\/wp-content\/uploads\/2025\/03\/bootstrap-buttons-vippro.png\" alt=\"bootstrap - buttons - itviec blog\" class=\"wp-image-85133\" srcset=\"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/03\/bootstrap-buttons-vippro.png 1548w, https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/03\/bootstrap-buttons-vippro-300x33.png 300w, https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/03\/bootstrap-buttons-vippro-1536x171.png 640w, https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/03\/bootstrap-buttons-vippro-200x22.png 200w\" sizes=\"auto, (max-width: 1548px) 100vw, 1548px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-navigation\"><b>Navigation<\/b><\/h3>\n\n\n\n<p><span style=\"font-weight: 400;\">Trong Bootstrap, Navigation (\u0110i\u1ec1u h\u01b0\u1edbng) l\u00e0 m\u1ed9t t\u1eadp h\u1ee3p c\u00e1c th\u00e0nh ph\u1ea7n gi\u00fap t\u1ea1o menu, thanh \u0111i\u1ec1u h\u01b0\u1edbng (navbar), tab v\u00e0 breadcrumb m\u1ed9t c\u00e1ch d\u1ec5 d\u00e0ng. M\u1ed9t s\u1ed1 th\u00e0nh ph\u1ea7n \u0111i\u1ec1u h\u01b0\u1edbng ph\u1ed5 bi\u1ebfn trong Bootstrap:<\/span><\/p>\n\n\n\n<h4 class=\"wp-block-heading\" id=\"h-nav\"><b>Nav<\/b><\/h4>\n\n\n\n<p><span style=\"font-weight: 400;\">Th\u00e0nh ph\u1ea7n Nav (.nav) \u0111\u01b0\u1ee3c x\u00e2y d\u1ef1ng b\u1eb1ng <\/span><b>flexbox<\/b><span style=\"font-weight: 400;\">, cung c\u1ea5p n\u1ec1n t\u1ea3ng v\u1eefng ch\u1eafc \u0111\u1ec3 t\u1ea1o m\u1ecdi lo\u1ea1i \u0111i\u1ec1u h\u01b0\u1edbng. N\u00f3 bao g\u1ed3m m\u1ed9t s\u1ed1 \u0111i\u1ec1u ch\u1ec9nh v\u1ec1 ki\u1ec3u d\u00e1ng (\u0111\u1ec3 l\u00e0m vi\u1ec7c v\u1edbi danh s\u00e1ch), kho\u1ea3ng \u0111\u1ec7m cho li\u00ean k\u1ebft \u0111\u1ec3 t\u0103ng v\u00f9ng nh\u1ea5p chu\u1ed9t, v\u00e0 ki\u1ec3u d\u00e0nh cho tr\u1ea1ng th\u00e1i <\/span><b>disabled<\/b><span style=\"font-weight: 400;\">.<\/span><\/p>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"828\" height=\"178\" src=\"\/blog\/wp-content\/uploads\/2025\/03\/bootstrap-navigation-nav-vippro.jpg\" alt=\"bootstrap - navigation - nav - itviec blog\" class=\"wp-image-85132\" srcset=\"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/03\/bootstrap-navigation-nav-vippro.jpg 828w, https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/03\/bootstrap-navigation-nav-vippro-300x64.jpg 300w, https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/03\/bootstrap-navigation-nav-vippro-768x165.jpg 640w, https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/03\/bootstrap-navigation-nav-vippro-200x43.jpg 200w\" sizes=\"auto, (max-width: 828px) 100vw, 828px\" \/><\/figure>\n\n\n\n<h4 class=\"wp-block-heading\" id=\"h-navbar\"><b>Navbar<\/b><\/h4>\n\n\n\n<p><span style=\"font-weight: 400;\">Thanh \u0111i\u1ec1u h\u01b0\u1edbng l\u00e0 th\u00e0nh ph\u1ea7n n\u00e2ng cao h\u01a1n so v\u1edbi Nav. N\u00f3 h\u1ed7 tr\u1ee3 vi\u1ec7c hi\u1ec3n th\u1ecb logo\/th\u01b0\u01a1ng hi\u1ec7u, \u0111i\u1ec1u h\u01b0\u1edbng v\u00e0 nhi\u1ec1u t\u00ednh n\u0103ng kh\u00e1c, bao g\u1ed3m c\u1ea3 h\u1ed7 tr\u1ee3 collapse plugin.<\/span><\/p>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"1940\" height=\"466\" src=\"\/blog\/wp-content\/uploads\/2025\/03\/bootstrap-navigation-navbar-vippro.png\" alt=\"bootstrap - navigation - navbar - itviec blog\" class=\"wp-image-85131\" srcset=\"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/03\/bootstrap-navigation-navbar-vippro.png 1940w, https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/03\/bootstrap-navigation-navbar-vippro-300x72.png 300w, https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/03\/bootstrap-navigation-navbar-vippro-1536x369.png 640w, https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/03\/bootstrap-navigation-navbar-vippro-200x48.png 200w\" sizes=\"auto, (max-width: 1940px) 100vw, 1940px\" \/><\/figure>\n\n\n\n<h4 class=\"wp-block-heading\" id=\"h-breadcrumb\"><b>Breadcrumb<\/b><\/h4>\n\n\n\n<p><span style=\"font-weight: 400;\">Breadcrumb trong bootstrap \u0111\u01b0\u1ee3c thi\u1ebft k\u1ebf s\u1eb5n gi\u00fap hi\u1ec3n th\u1ecb v\u1ecb tr\u00ed hi\u1ec7n t\u1ea1i c\u1ee7a ng\u01b0\u1eddi d\u00f9ng trong h\u1ec7 th\u1ed1ng ph\u00e2n c\u1ea5p c\u1ee7a trang web m\u1ed9t c\u00e1ch tr\u1ef1c quan. Gi\u00fap ng\u01b0\u1eddi d\u00f9ng nh\u1eadn di\u1ec7n v\u1ecb tr\u00ed trang web hi\u1ec7n t\u1ea1i v\u00e0 d\u1ec5 d\u00e0ng di chuy\u1ec3n gi\u1eefa c\u00e1c c\u1ea5p \u0111\u1ed9 trang.<\/span><\/p>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"1890\" height=\"430\" src=\"\/blog\/wp-content\/uploads\/2025\/03\/bootstrap-navigation-breadcrumb-vippro.png\" alt=\"bootstrap - navigation - breadcrumb - itviec blog\" class=\"wp-image-85130\" srcset=\"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/03\/bootstrap-navigation-breadcrumb-vippro.png 1890w, https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/03\/bootstrap-navigation-breadcrumb-vippro-300x68.png 300w, https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/03\/bootstrap-navigation-breadcrumb-vippro-1536x349.png 640w, https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/03\/bootstrap-navigation-breadcrumb-vippro-200x46.png 200w, https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/03\/bootstrap-navigation-breadcrumb-vippro-768x175.png 768w\" sizes=\"auto, (max-width: 1890px) 100vw, 1890px\" \/><\/figure>\n\n\n\n<p><span style=\"font-weight: 400;\"><\/span><\/p>\n\n\n\n<h4 class=\"wp-block-heading\" id=\"h-pagination\"><b>Pagination<\/b><\/h4>\n\n\n\n<p><span style=\"font-weight: 400;\">M\u1ed9t th\u00e0nh ph\u1ea7n gi\u00fap t\u1ea1o h\u1ec7 th\u1ed1ng ph\u00e2n trang tr\u1ef1c quan, gi\u00fap ng\u01b0\u1eddi d\u00f9ng d\u1ec5 d\u00e0ng \u0111i\u1ec1u h\u01b0\u1edbng qua nhi\u1ec1u trang n\u1ed9i dung. N\u00f3 s\u1eed d\u1ee5ng c\u00e1c li\u00ean k\u1ebft \u0111\u01b0\u1ee3c k\u1ebft n\u1ed1i trong m\u1ed9t danh s\u00e1ch \u0111\u1ec3 d\u1ec5 nh\u1eadn di\u1ec7n, d\u1ec5 m\u1edf r\u1ed9ng v\u00e0 c\u00f3 v\u00f9ng nh\u1ea5p chu\u1ed9t l\u1edbn.<\/span><\/p>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"792\" height=\"166\" src=\"\/blog\/wp-content\/uploads\/2025\/03\/bootstrap-navigation-pagination-vippro.jpg\" alt=\"bootstrap - navigation - pagination - itviec blog\" class=\"wp-image-85129\" srcset=\"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/03\/bootstrap-navigation-pagination-vippro.jpg 792w, https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/03\/bootstrap-navigation-pagination-vippro-300x63.jpg 300w, https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/03\/bootstrap-navigation-pagination-vippro-768x161.jpg 640w, https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/03\/bootstrap-navigation-pagination-vippro-200x42.jpg 200w\" sizes=\"auto, (max-width: 792px) 100vw, 792px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-alerts\"><b>Alerts<\/b><\/h3>\n\n\n\n<p><span style=\"font-weight: 400;\">Bootstrap \u0111\u1ecbnh ngh\u0129a s\u1eb5n m\u1ed9t t\u1eadp h\u1ee3p c\u00e1c lo\u1ea1i th\u00f4ng b\u00e1o cho t\u1eebng m\u1ee5c \u0111\u00edch c\u1ee5 th\u1ec3 nh\u01b0 th\u00f4ng b\u00e1o l\u1ed7i, th\u00f4ng b\u00e1o th\u00e0nh c\u00f4ng, th\u00f4ng tin, c\u1ea3nh b\u00e1o,.. Ch\u00fang h\u1ed7 tr\u1ee3 nhi\u1ec1u ki\u1ec3u d\u00e1ng m\u00e0u s\u1eafc, c\u00f3 th\u1ec3 \u0111\u00f3ng \u0111\u01b0\u1ee3c (dismissible) v\u00e0 t\u00f9y ch\u1ec9nh n\u1ed9i dung d\u1ec5 d\u00e0ng.<\/span><\/p>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"2254\" height=\"1124\" src=\"\/blog\/wp-content\/uploads\/2025\/03\/bootstrap-alerts-vippro.png\" alt=\"bootstrap - alerts - itviec blog\" class=\"wp-image-85128\" srcset=\"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/03\/bootstrap-alerts-vippro.png 2254w, https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/03\/bootstrap-alerts-vippro-300x150.png 300w, https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/03\/bootstrap-alerts-vippro-2048x1021.png 640w, https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/03\/bootstrap-alerts-vippro-200x100.png 200w\" sizes=\"auto, (max-width: 2254px) 100vw, 2254px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-images\"><b>Images<\/b><\/h3>\n\n\n\n<p><span style=\"font-weight: 400;\">Bootstrap cung c\u1ea5p m\u1ed9t s\u1ed1 l\u1edbp CSS gi\u00fap hi\u1ec3n th\u1ecb v\u00e0 x\u1eed l\u00fd h\u00ecnh \u1ea3nh m\u1ed9t c\u00e1ch linh ho\u1ea1t v\u00e0 th\u1ea9m m\u1ef9. M\u1ed9t s\u1ed1 t\u00ednh n\u0103ng ch\u00ednh g\u1ed3m:<\/span><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><b>Responsive Images<\/b><span style=\"font-weight: 400;\">: S\u1eed d\u1ee5ng l\u1edbp .img-fluid \u0111\u1ec3 h\u00ecnh \u1ea3nh t\u1ef1 \u0111\u1ed9ng co gi\u00e3n theo k\u00edch th\u01b0\u1edbc c\u1ee7a khung ch\u1ee9a, \u0111\u1ea3m b\u1ea3o t\u00ednh ph\u1ea3n h\u1ed3i tr\u00ean m\u1ecdi thi\u1ebft b\u1ecb.<\/span><\/li>\n\n\n\n<li><b>Rounded Corners<\/b><span style=\"font-weight: 400;\">: D\u00f9ng l\u1edbp .rounded \u0111\u1ec3 t\u1ea1o vi\u1ec1n bo tr\u00f2n cho h\u00ecnh \u1ea3nh, t\u1ea1o c\u1ea3m gi\u00e1c m\u1ec1m m\u1ea1i, th\u00e2n thi\u1ec7n.<\/span><\/li>\n\n\n\n<li><b>Circular Images<\/b><span style=\"font-weight: 400;\">: \u00c1p d\u1ee5ng l\u1edbp .rounded-circle \u0111\u1ec3 hi\u1ec3n th\u1ecb h\u00ecnh \u1ea3nh v\u1edbi d\u1ea1ng h\u00ecnh tr\u00f2n.<\/span><\/li>\n\n\n\n<li><b>Image Thumbnails<\/b><span style=\"font-weight: 400;\">: S\u1eed d\u1ee5ng l\u1edbp .img-thumbnail \u0111\u1ec3 t\u1ea1o hi\u1ec7u \u1ee9ng khung vi\u1ec1n xung quanh h\u00ecnh \u1ea3nh, th\u01b0\u1eddng \u0111\u01b0\u1ee3c d\u00f9ng cho c\u00e1c \u1ea3nh nh\u1ecf, nh\u1eb1m t\u1ea1o \u0111i\u1ec3m nh\u1ea5n r\u00f5 r\u00e0ng.<\/span><\/li>\n<\/ul>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-javascript-plugins\"><b>JavaScript Plugins<\/b><\/h3>\n\n\n\n<p><span style=\"font-weight: 400;\">Bootstrap cung c\u1ea5p c\u00e1c javascript plugins c\u00f3 th\u1ec3 \u0111\u01b0\u1ee3c k\u00edch ho\u1ea1t v\u00e0 c\u1ea5u h\u00ecnh ch\u1ec9 b\u1eb1ng HTML (<\/span><b>data attributes)<\/b><span style=\"font-weight: 400;\">, gi\u00fap s\u1eed d\u1ee5ng t\u00ednh n\u0103ng JavaScript m\u00e0 kh\u00f4ng c\u1ea7n vi\u1ebft m\u00e3. M\u1ed9t s\u1ed1 plugins ph\u1ed5 bi\u1ebfn trong Bootstrap bao g\u1ed3m:<\/span><\/p>\n\n\n\n<figure class=\"wp-block-table\"><table class=\"has-fixed-layout\"><tbody><tr><td><b>Plugin<\/b><\/td><td><b>M\u00f4 t\u1ea3<\/b><\/td><\/tr><tr><td><span style=\"font-weight: 400;\">Modal<\/span><\/td><td><span style=\"font-weight: 400;\">Hi\u1ec3n th\u1ecb c\u1eeda s\u1ed5 pop-up modal<\/span><\/td><\/tr><tr><td><span style=\"font-weight: 400;\">Tooltip<\/span><\/td><td><span style=\"font-weight: 400;\">Hi\u1ec3n th\u1ecb ch\u00fa th\u00edch khi di chu\u1ed9t v\u00e0o ph\u1ea7n t\u1eed<\/span><\/td><\/tr><tr><td><span style=\"font-weight: 400;\">Popover<\/span><\/td><td><span style=\"font-weight: 400;\">Gi\u1ed1ng Tooltip nh\u01b0ng hi\u1ec3n th\u1ecb n\u1ed9i dung l\u1edbn h\u01a1n.<\/span><\/td><\/tr><tr><td><span style=\"font-weight: 400;\">Carousel<\/span><\/td><td><span style=\"font-weight: 400;\">T\u1ea1o tr\u00ecnh chi\u1ebfu \u1ea3nh (slider)<\/span><\/td><\/tr><tr><td><span style=\"font-weight: 400;\">Collapse<\/span><\/td><td><span style=\"font-weight: 400;\">Thu g\u1ecdn\/m\u1edf r\u1ed9ng n\u1ed9i dung (accordion, navbar)<\/span><\/td><\/tr><tr><td><span style=\"font-weight: 400;\">Dropdown<\/span><\/td><td><span style=\"font-weight: 400;\">Hi\u1ec3n th\u1ecb menu dropdown khi nh\u1ea5n v\u00e0o n\u00fat<\/span><\/td><\/tr><tr><td><span style=\"font-weight: 400;\">Toast<\/span><\/td><td><span style=\"font-weight: 400;\">Hi\u1ec3n th\u1ecb th\u00f4ng b\u00e1o nh\u1ecf tr\u00ean m\u00e0n h\u00ecnh<\/span><\/td><\/tr><tr><td><span style=\"font-weight: 400;\">Scrollspy<\/span><\/td><td><span style=\"font-weight: 400;\">Theo d\u00f5i v\u1ecb tr\u00ed cu\u1ed9n c\u1ee7a trang \u0111\u1ec3 c\u1eadp nh\u1eadt menu<\/span><\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n<p><span style=\"font-weight: 400;\">Ngo\u00e0i ra, nh\u1eefng plugins n\u00e0y c\u0169ng c\u00f3 th\u1ec3 \u0111\u01b0\u1ee3c t\u00f9y ch\u1ec9nh th\u00f4ng qua c\u00e1c s\u1ef1 ki\u1ec7n (events).<\/span><\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-h\u01b0\u1edbng-d\u1eabn-cai-d\u1eb7t-bootstrap\"><span class=\"ez-toc-section\" id=\"Huong_dan_cai_dat_Bootstrap\"><\/span><b>H\u01b0\u1edbng d\u1eabn c\u00e0i \u0111\u1eb7t Bootstrap<\/b><span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-s\u1eed-d\u1ee5ng-cdn\"><b>S\u1eed d\u1ee5ng CDN<\/b><\/h3>\n\n\n\n<p><span style=\"font-weight: 400;\">CDN (Content Delivery Network) gi\u00fap b\u1ea1n t\u00edch h\u1ee3p Bootstrap nhanh ch\u00f3ng m\u00e0 kh\u00f4ng c\u1ea7n t\u1ea3i v\u1ec1 ho\u1eb7c c\u00e0i \u0111\u1eb7t. Ch\u1ec9 c\u1ea7n th\u00eam c\u00e1c li\u00ean k\u1ebft sau v\u00e0o ph\u1ea7n &lt;head&gt; v\u00e0 tr\u01b0\u1edbc th\u1ebb \u0111\u00f3ng &lt;\/body&gt; c\u1ee7a t\u1eadp tin HTML:<\/span><\/p>\n\n\n\n<pre class=\"wp-block-code\"><code><span style=\"font-weight: 400;\">&lt;!-- Bootstrap CSS --&gt;<\/span>\n<span style=\"font-weight: 400;\">&lt;<\/span><span style=\"font-weight: 400;\">link<\/span><span style=\"font-weight: 400;\"> rel=<\/span><span style=\"font-weight: 400;\">\"stylesheet\"<\/span><span style=\"font-weight: 400;\"> href=<\/span><span style=\"font-weight: 400;\">\"https:\/\/cdn.jsdelivr.net\/npm\/bootstrap@4.3.1\/dist\/css\/bootstrap.min.css\"<\/span><span style=\"font-weight: 400;\"> integrity=<\/span><span style=\"font-weight: 400;\">\"sha384-ggOyR0iXCbMQv3Xipma34MD+dH\/1fQ784\/j6cY\/iJTQUOhcWr7x9JvoRxT2MZw1T\"<\/span><span style=\"font-weight: 400;\"> crossorigin=<\/span><span style=\"font-weight: 400;\">\"anonymous\"<\/span><span style=\"font-weight: 400;\">&gt;<\/span>\n\n<span style=\"font-weight: 400;\">&lt;!-- Bootstrap JavaScript --&gt;<\/span>\n<span style=\"font-weight: 400;\">&lt;<\/span><span style=\"font-weight: 400;\">script<\/span><span style=\"font-weight: 400;\"> src=<\/span><span style=\"font-weight: 400;\">\"https:\/\/cdn.jsdelivr.net\/npm\/bootstrap@4.3.1\/dist\/js\/bootstrap.min.js\"<\/span><span style=\"font-weight: 400;\"> integrity=<\/span><span style=\"font-weight: 400;\">\"sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf\/nJGzIxFDsf4x0xIM+B07jRM\"<\/span><span style=\"font-weight: 400;\"> crossorigin=<\/span><span style=\"font-weight: 400;\">\"anonymous\"<\/span><span style=\"font-weight: 400;\">&gt;&lt;\/<\/span><span style=\"font-weight: 400;\">script<\/span><span style=\"font-weight: 400;\">&gt;<\/span><\/code><\/pre>\n\n\n\n<p><span style=\"font-weight: 400;\">\u0110i\u1ec1u n\u00e0y s\u1ebd gi\u00fap ch\u00e8n Bootstrap CSS v\u00e0 JavaScript t\u1eeb CDN v\u00e0o d\u1ef1 \u00e1n c\u1ee7a b\u1ea1n. Trong tr\u01b0\u1eddng h\u1ee3p b\u1ea1n s\u1eed d\u1ee5ng c\u00e1c th\u00e0nh ph\u1ea7n Bootstrap c\u00f3 JavaScript, h\u00e3y th\u00eam <\/span><b>jQuery<\/b><span style=\"font-weight: 400;\"> v\u00e0 <\/span><b>Popper.js<\/b><span style=\"font-weight: 400;\"> (\u0111\u00e2y l\u00e0 hai th\u01b0 vi\u1ec7n c\u1ea7n thi\u1ebft \u0111\u1ec3 Bootstrap ho\u1ea1t \u0111\u1ed9ng \u0111\u1ea7y \u0111\u1ee7):<\/span><\/p>\n\n\n\n<pre class=\"wp-block-code\"><code><span style=\"font-weight: 400;\">&lt;!-- jQuery --&gt;<\/span>\n<span style=\"font-weight: 400;\">&lt;<\/span><span style=\"font-weight: 400;\">script<\/span><span style=\"font-weight: 400;\"> src=<\/span><span style=\"font-weight: 400;\">\"https:\/\/code.jquery.com\/jquery-3.2.1.slim.min.js\"<\/span><span style=\"font-weight: 400;\"> integrity=<\/span><span style=\"font-weight: 400;\">\"sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr\/rE9\/Qpg6aAZGJwFDMVNA\/GpGFF93hXpG5KkN\"<\/span><span style=\"font-weight: 400;\"> crossorigin=<\/span><span style=\"font-weight: 400;\">\"anonymous\"<\/span><span style=\"font-weight: 400;\">&gt;&lt;\/<\/span><span style=\"font-weight: 400;\">script<\/span><span style=\"font-weight: 400;\">&gt;<\/span>\n\n<span style=\"font-weight: 400;\">&lt;!-- Popper.js --&gt;<\/span>\n<span style=\"font-weight: 400;\">&lt;<\/span><span style=\"font-weight: 400;\">script<\/span><span style=\"font-weight: 400;\"> src=<\/span><span style=\"font-weight: 400;\">\"https:\/\/cdn.jsdelivr.net\/npm\/popper.js@1.12.9\/dist\/umd\/popper.min.js\"<\/span><span style=\"font-weight: 400;\"> integrity=<\/span><span style=\"font-weight: 400;\">\"sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K\/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q\"<\/span><span style=\"font-weight: 400;\"> crossorigin=<\/span><span style=\"font-weight: 400;\">\"anonymous\"<\/span><span style=\"font-weight: 400;\">&gt;&lt;\/<\/span><span style=\"font-weight: 400;\">script<\/span><span style=\"font-weight: 400;\">&gt;<\/span><\/code><\/pre>\n\n\n\n<blockquote class=\"wp-block-quote is-layout-flow wp-block-quote-is-layout-flow\">\n<p><em>\u0110\u1ecdc th\u00eam: <a href=\"\/blog\/bootstrap-cdn-la-gi\/\" target=\"_blank\" rel=\"noopener\"><strong>Bootstrap CDN: C\u00e1ch t\u00edch h\u1ee3p nhanh Bootstrap v\u00e0o d\u1ef1 \u00e1n<\/strong><\/a><\/em><\/p>\n<\/blockquote>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-cai-d\u1eb7t-bootstrap-trong-d\u1ef1-an-node-js\"><b>C\u00e0i \u0111\u1eb7t Bootstrap trong d\u1ef1 \u00e1n Node.js<\/b><\/h3>\n\n\n\n<p><span style=\"font-weight: 400;\">N\u1ebfu b\u1ea1n \u0111ang ph\u00e1t tri\u1ec3n \u1ee9ng d\u1ee5ng b\u1eb1ng <\/span><b>Node.js<\/b><span style=\"font-weight: 400;\">, c\u00f3 th\u1ec3 c\u00e0i \u0111\u1eb7t Bootstrap th\u00f4ng qua <\/span><b>npm<\/b><span style=\"font-weight: 400;\"> v\u1edbi l\u1ec7nh sau:<\/span><\/p>\n\n\n\n<pre class=\"wp-block-code\"><code><span style=\"font-weight: 400;\">npm install bootstrap<\/span><\/code><\/pre>\n\n\n\n<p><span style=\"font-weight: 400;\">Sau khi c\u00e0i \u0111\u1eb7t, b\u1ea1n c\u00f3 th\u1ec3 s\u1eed d\u1ee5ng Bootstrap b\u1eb1ng c\u00e1ch import:<\/span><\/p>\n\n\n\n<pre class=\"wp-block-code\"><code><span style=\"font-weight: 400;\">require<\/span><span style=\"font-weight: 400;\">(<\/span><span style=\"font-weight: 400;\">'bootstrap'<\/span><span style=\"font-weight: 400;\">);<\/span><\/code><\/pre>\n\n\n\n<p><span style=\"font-weight: 400;\">\u0110i\u1ec1u n\u00e0y s\u1ebd t\u1ea3i t\u1ea5t c\u1ea3 c\u00e1c plugin jQuery c\u1ee7a Bootstrap v\u00e0o \u0111\u1ed1i t\u01b0\u1ee3ng jQuery. Tuy nhi\u00ean, Bootstrap kh\u00f4ng xu\u1ea5t module n\u00e0o theo m\u1eb7c \u0111\u1ecbnh. B\u1ea1n c\u00f3 th\u1ec3 t\u1ea3i c\u00e1c plugin jQuery ri\u00eang l\u1ebb b\u1eb1ng c\u00e1ch import c\u00e1c file .js trong th\u01b0 m\u1ee5c \/js\/ c\u1ee7a Bootstrap.<\/span><\/p>\n\n\n\n<p><span style=\"font-weight: 400;\">N\u1ebfu b\u1ea1n s\u1eed d\u1ee5ng <\/span><b>Yarn<\/b><span style=\"font-weight: 400;\"> thay v\u00ec <\/span><b>Npm<\/b><span style=\"font-weight: 400;\">, c\u00f3 th\u1ec3 c\u00e0i \u0111\u1eb7t Bootstrap b\u1eb1ng l\u1ec7nh:<\/span><\/p>\n\n\n\n<pre class=\"wp-block-code\"><code><span style=\"font-weight: 400;\">yarn add bootstrap<\/span><\/code><\/pre>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-cai-d\u1eb7t-bootstrap-trong-d\u1ef1-an-ruby\"><b>C\u00e0i \u0111\u1eb7t Bootstrap trong d\u1ef1 \u00e1n Ruby<\/b><\/h3>\n\n\n\n<p><span style=\"font-weight: 400;\">N\u1ebfu b\u1ea1n \u0111ang ph\u00e1t tri\u1ec3n \u1ee9ng d\u1ee5ng <\/span><b>Ruby on Rails<\/b><span style=\"font-weight: 400;\">, h\u00e3y c\u00e0i \u0111\u1eb7t Bootstrap b\u1eb1ng <\/span><b>RubyGems<\/b><span style=\"font-weight: 400;\"> th\u00f4ng qua Bundler:<\/span><\/p>\n\n\n\n<p><span style=\"font-weight: 400;\">Th\u00eam d\u00f2ng sau v\u00e0o <\/span><b>Gemfile<\/b><span style=\"font-weight: 400;\">:<\/span><\/p>\n\n\n\n<pre class=\"wp-block-code\"><code><span style=\"font-weight: 400;\">gem <\/span><span style=\"font-weight: 400;\">'bootstrap'<\/span><span style=\"font-weight: 400;\">, <\/span><span style=\"font-weight: 400;\">'~&gt; 4.3.1'<\/span><\/code><\/pre>\n\n\n\n<p><span style=\"font-weight: 400;\">Sau \u0111\u00f3 ch\u1ea1y:<\/span><\/p>\n\n\n\n<pre class=\"wp-block-code\"><code><span style=\"font-weight: 400;\">bundle install<\/span><\/code><\/pre>\n\n\n\n<p><span style=\"font-weight: 400;\">Ho\u1eb7c n\u1ebfu b\u1ea1n kh\u00f4ng s\u1eed d\u1ee5ng <\/span><b>Bundler<\/b><span style=\"font-weight: 400;\">, c\u00f3 th\u1ec3 c\u00e0i \u0111\u1eb7t tr\u1ef1c ti\u1ebfp b\u1eb1ng l\u1ec7nh:<\/span><\/p>\n\n\n\n<pre class=\"wp-block-code\"><code><span style=\"font-weight: 400;\">gem install bootstrap -v <\/span><span style=\"font-weight: 400;\">4.3<\/span><span style=\"font-weight: 400;\">.<\/span><span style=\"font-weight: 400;\">1<\/span><\/code><\/pre>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-cai-d\u1eb7t-bootstrap-trong-d\u1ef1-an-php\"><b>C\u00e0i \u0111\u1eb7t Bootstrap trong d\u1ef1 \u00e1n PHP<\/b><\/h3>\n\n\n\n<p><span style=\"font-weight: 400;\">N\u1ebfu b\u1ea1n ph\u00e1t tri\u1ec3n \u1ee9ng d\u1ee5ng PHP, c\u00f3 th\u1ec3 c\u00e0i \u0111\u1eb7t Bootstrap b\u1eb1ng <\/span><b>Composer<\/b><span style=\"font-weight: 400;\"> v\u1edbi l\u1ec7nh:<\/span><\/p>\n\n\n\n<pre class=\"wp-block-code\"><code><span style=\"font-weight: 400;\">composer <\/span><span style=\"font-weight: 400;\">require<\/span><span style=\"font-weight: 400;\"> twbs\/<\/span><span style=\"font-weight: 400;\">bootstrap:<\/span><span style=\"font-weight: 400;\">4.3<\/span><span style=\"font-weight: 400;\">.<\/span><span style=\"font-weight: 400;\">1<\/span><\/code><\/pre>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-cai-d\u1eb7t-bootstrap-trong-d\u1ef1-an-net\"><b>C\u00e0i \u0111\u1eb7t Bootstrap trong d\u1ef1 \u00e1n .Net<\/b><\/h3>\n\n\n\n<p><span style=\"font-weight: 400;\">N\u1ebfu b\u1ea1n \u0111ang l\u00e0m vi\u1ec7c v\u1edbi <\/span><b>.NET Framework ho\u1eb7c .NET Core<\/b><span style=\"font-weight: 400;\">, c\u00f3 th\u1ec3 c\u00e0i \u0111\u1eb7t Bootstrap th\u00f4ng qua <\/span><b>NuGet<\/b><span style=\"font-weight: 400;\">:<\/span><\/p>\n\n\n\n<pre class=\"wp-block-code\"><code><span style=\"font-weight: 400;\">Install-Package bootstrap<\/span><\/code><\/pre>\n\n\n\n<p><span style=\"font-weight: 400;\">Ho\u1eb7c n\u1ebfu b\u1ea1n mu\u1ed1n c\u00e0i \u0111\u1eb7t phi\u00ean b\u1ea3n Sass:<\/span><\/p>\n\n\n\n<pre class=\"wp-block-code\"><code><span style=\"font-weight: 400;\">Install-Package bootstrap.sass<\/span><\/code><\/pre>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-vi-d\u1ee5-v\u1ec1-cach-s\u1eed-d\u1ee5ng-bootstrap\"><span class=\"ez-toc-section\" id=\"Vi_du_ve_cach_su_dung_Bootstrap\"><\/span><b>V\u00ed d\u1ee5 v\u1ec1 c\u00e1ch s\u1eed d\u1ee5ng Bootstrap<\/b><span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p><span style=\"font-weight: 400;\">D\u01b0\u1edbi \u0111\u00e2y l\u00e0 c\u00e1c v\u00ed d\u1ee5 c\u01a1 b\u1ea3n s\u1eed d\u1ee5ng Bootstrap \u0111\u1ec3 t\u1ea1o giao di\u1ec7n trang web:<\/span><\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-t\u1ea1o-header-bao-g\u1ed3m-ten-th\u01b0\u01a1ng-hi\u1ec7u-va-menu-di\u1ec1u-h\u01b0\u1edbng-nav\"><b>T\u1ea1o header bao g\u1ed3m t\u00ean th\u01b0\u01a1ng hi\u1ec7u v\u00e0 menu \u0111i\u1ec1u h\u01b0\u1edbng (nav)<\/b><\/h3>\n\n\n\n<pre class=\"wp-block-code\"><code><span style=\"font-weight: 400;\">&nbsp; &lt;<\/span><span style=\"font-weight: 400;\">div<\/span><span style=\"font-weight: 400;\"> class=<\/span><span style=\"font-weight: 400;\">\"container\"<\/span><span style=\"font-weight: 400;\">&gt;<\/span>\n<span style=\"font-weight: 400;\"> &nbsp; &nbsp; &lt;<\/span><span style=\"font-weight: 400;\">header<\/span><span style=\"font-weight: 400;\"> class=<\/span><span style=\"font-weight: 400;\">\"d-flex flex-wrap justify-content-center py-3 mb-4 border-bottom\"<\/span><span style=\"font-weight: 400;\">&gt;<\/span>\n<span style=\"font-weight: 400;\"> &nbsp; &nbsp; &nbsp; &lt;<\/span><span style=\"font-weight: 400;\">a<\/span><span style=\"font-weight: 400;\"> href=<\/span><span style=\"font-weight: 400;\">\"\/\"<\/span><span style=\"font-weight: 400;\"> class=<\/span><span style=\"font-weight: 400;\">\"d-flex align-items-center mb-3 mb-md-0 me-md-auto text-dark text-decoration-none\"<\/span><span style=\"font-weight: 400;\">&gt;<\/span>\n<span style=\"font-weight: 400;\"> &nbsp; &nbsp; &nbsp; &nbsp; &lt;<\/span><span style=\"font-weight: 400;\">span<\/span><span style=\"font-weight: 400;\"> class=<\/span><span style=\"font-weight: 400;\">\"fs-4\"<\/span><span style=\"font-weight: 400;\">&gt;IT Viec&lt;\/<\/span><span style=\"font-weight: 400;\">span<\/span><span style=\"font-weight: 400;\">&gt;<\/span>\n<span style=\"font-weight: 400;\"> &nbsp; &nbsp; &nbsp; &lt;\/<\/span><span style=\"font-weight: 400;\">a<\/span><span style=\"font-weight: 400;\">&gt;<\/span>\n<span style=\"font-weight: 400;\">&nbsp; &nbsp; &nbsp; &nbsp; &lt;<\/span><span style=\"font-weight: 400;\">ul<\/span><span style=\"font-weight: 400;\"> class=<\/span><span style=\"font-weight: 400;\">\"nav nav-pills\"<\/span><span style=\"font-weight: 400;\">&gt;<\/span>\n<span style=\"font-weight: 400;\"> &nbsp; &nbsp; &nbsp; &nbsp; &lt;<\/span><span style=\"font-weight: 400;\">li<\/span><span style=\"font-weight: 400;\"> class=<\/span><span style=\"font-weight: 400;\">\"nav-item\"<\/span><span style=\"font-weight: 400;\">&gt;&lt;<\/span><span style=\"font-weight: 400;\">a<\/span><span style=\"font-weight: 400;\"> href=<\/span><span style=\"font-weight: 400;\">\"#\"<\/span><span style=\"font-weight: 400;\"> class=<\/span><span style=\"font-weight: 400;\">\"nav-link active\"<\/span><span style=\"font-weight: 400;\"> aria-current=<\/span><span style=\"font-weight: 400;\">\"page\"<\/span><span style=\"font-weight: 400;\">&gt;Home&lt;\/<\/span><span style=\"font-weight: 400;\">a<\/span><span style=\"font-weight: 400;\">&gt;&lt;\/<\/span><span style=\"font-weight: 400;\">li<\/span><span style=\"font-weight: 400;\">&gt;<\/span>\n<span style=\"font-weight: 400;\"> &nbsp; &nbsp; &nbsp; &nbsp; &lt;<\/span><span style=\"font-weight: 400;\">li<\/span><span style=\"font-weight: 400;\"> class=<\/span><span style=\"font-weight: 400;\">\"nav-item\"<\/span><span style=\"font-weight: 400;\">&gt;&lt;<\/span><span style=\"font-weight: 400;\">a<\/span><span style=\"font-weight: 400;\"> href=<\/span><span style=\"font-weight: 400;\">\"#\"<\/span><span style=\"font-weight: 400;\"> class=<\/span><span style=\"font-weight: 400;\">\"nav-link\"<\/span><span style=\"font-weight: 400;\">&gt;Features&lt;\/<\/span><span style=\"font-weight: 400;\">a<\/span><span style=\"font-weight: 400;\">&gt;&lt;\/<\/span><span style=\"font-weight: 400;\">li<\/span><span style=\"font-weight: 400;\">&gt;<\/span>\n<span style=\"font-weight: 400;\"> &nbsp; &nbsp; &nbsp; &nbsp; &lt;<\/span><span style=\"font-weight: 400;\">li<\/span><span style=\"font-weight: 400;\"> class=<\/span><span style=\"font-weight: 400;\">\"nav-item\"<\/span><span style=\"font-weight: 400;\">&gt;&lt;<\/span><span style=\"font-weight: 400;\">a<\/span><span style=\"font-weight: 400;\"> href=<\/span><span style=\"font-weight: 400;\">\"#\"<\/span><span style=\"font-weight: 400;\"> class=<\/span><span style=\"font-weight: 400;\">\"nav-link\"<\/span><span style=\"font-weight: 400;\">&gt;FAQs&lt;\/<\/span><span style=\"font-weight: 400;\">a<\/span><span style=\"font-weight: 400;\">&gt;&lt;\/<\/span><span style=\"font-weight: 400;\">li<\/span><span style=\"font-weight: 400;\">&gt;<\/span>\n<span style=\"font-weight: 400;\"> &nbsp; &nbsp; &nbsp; &nbsp; &lt;<\/span><span style=\"font-weight: 400;\">li<\/span><span style=\"font-weight: 400;\"> class=<\/span><span style=\"font-weight: 400;\">\"nav-item\"<\/span><span style=\"font-weight: 400;\">&gt;&lt;<\/span><span style=\"font-weight: 400;\">a<\/span><span style=\"font-weight: 400;\"> href=<\/span><span style=\"font-weight: 400;\">\"#\"<\/span><span style=\"font-weight: 400;\"> class=<\/span><span style=\"font-weight: 400;\">\"nav-link\"<\/span><span style=\"font-weight: 400;\">&gt;About&lt;\/<\/span><span style=\"font-weight: 400;\">a<\/span><span style=\"font-weight: 400;\">&gt;&lt;\/<\/span><span style=\"font-weight: 400;\">li<\/span><span style=\"font-weight: 400;\">&gt;<\/span>\n<span style=\"font-weight: 400;\"> &nbsp; &nbsp; &nbsp; &lt;\/<\/span><span style=\"font-weight: 400;\">ul<\/span><span style=\"font-weight: 400;\">&gt;<\/span>\n<span style=\"font-weight: 400;\"> &nbsp; &nbsp; &lt;\/<\/span><span style=\"font-weight: 400;\">header<\/span><span style=\"font-weight: 400;\">&gt;<\/span>\n<span style=\"font-weight: 400;\"> &nbsp; &lt;\/<\/span><span style=\"font-weight: 400;\">div<\/span><span style=\"font-weight: 400;\">&gt;<\/span><\/code><\/pre>\n\n\n\n<p><span style=\"font-weight: 400;\">Trong \u0111\u00f3:<\/span><\/p>\n\n\n\n<p><span style=\"font-weight: 400;\">Header (&lt;header&gt;):<\/span><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><span style=\"font-weight: 400;\">D\u00f9ng <\/span><b>d-flex<\/b><span style=\"font-weight: 400;\"> \u0111\u1ec3 b\u1ed1 c\u1ee5c linh ho\u1ea1t<\/span><\/li>\n\n\n\n<li><b>justify-content-cente<\/b><span style=\"font-weight: 400;\">r \u0111\u1ec3 c\u0103n gi\u1eefa n\u1ed9i dung<\/span><\/li>\n\n\n\n<li><b>border-bottom<\/b><span style=\"font-weight: 400;\"> t\u1ea1o vi\u1ec1n ng\u0103n c\u00e1ch<\/span><\/li>\n\n\n\n<li><b>py-3 mb-4<\/b><span style=\"font-weight: 400;\"> \u0111i\u1ec1u ch\u1ec9nh kho\u1ea3ng c\u00e1ch<\/span><\/li>\n<\/ul>\n\n\n\n<p><span style=\"font-weight: 400;\">Logo \/ Ti\u00eau \u0111\u1ec1 (&lt;a&gt;):<\/span><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><b>d-flex align-items-center<\/b><span style=\"font-weight: 400;\"> \u0111\u1ec3 c\u0103n gi\u1eefa logo theo chi\u1ec1u d\u1ecdc<\/span><\/li>\n\n\n\n<li><b>me-md-auto<\/b><span style=\"font-weight: 400;\"> \u0111\u1ea9y logo v\u1ec1 tr\u00e1i (khi m\u00e0n h\u00ecnh l\u1edbn)<\/span><\/li>\n\n\n\n<li><b>text-dark text-decoration-none<\/b><span style=\"font-weight: 400;\"> gi\u1eef m\u00e0u v\u00e0 b\u1ecf g\u1ea1ch ch\u00e2n.<\/span><\/li>\n<\/ul>\n\n\n\n<p><span style=\"font-weight: 400;\">Thanh \u0111i\u1ec1u h\u01b0\u1edbng (&lt;ul class=&#8221;nav nav-pills&#8221;&gt;):<\/span><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><b>nav + nav-pills<\/b><span style=\"font-weight: 400;\"> t\u1ea1o menu d\u1ea1ng vi\u00ean thu\u1ed1c<\/span><\/li>\n\n\n\n<li><b>nav-item + nav-link<\/b><span style=\"font-weight: 400;\"> \u0111\u1ecbnh d\u1ea1ng t\u1eebng m\u1ee5c menu<\/span><\/li>\n\n\n\n<li><b>active<\/b><span style=\"font-weight: 400;\"> \u0111\u00e1nh d\u1ea5u trang hi\u1ec7n t\u1ea1i<\/span><\/li>\n<\/ul>\n\n\n\n<p><span style=\"font-weight: 400;\">H\u00ecnh \u1ea3nh k\u1ebft qu\u1ea3:<\/span><\/p>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"640\" height=\"47\" src=\"\/blog\/wp-content\/uploads\/2025\/03\/bootstrap-header-example-vippro-e1742456452792.jpg\" alt=\"bootstrap - v\u00ed d\u1ee5 header - itviec blog\" class=\"wp-image-85137\" srcset=\"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/03\/bootstrap-header-example-vippro-e1742456452792.jpg 640w, https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/03\/bootstrap-header-example-vippro-e1742456452792-300x22.jpg 300w, https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/03\/bootstrap-header-example-vippro-e1742456452792-200x15.jpg 200w\" sizes=\"auto, (max-width: 640px) 100vw, 640px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-t\u1ea1o-form-dang-nh\u1eadp\"><b>T\u1ea1o form \u0111\u0103ng nh\u1eadp<\/b><\/h3>\n\n\n\n<pre class=\"wp-block-code\"><code><span style=\"font-weight: 400;\">&nbsp; &lt;<\/span><span style=\"font-weight: 400;\">div<\/span><span style=\"font-weight: 400;\"> class=<\/span><span style=\"font-weight: 400;\">\"container w-25\"<\/span><span style=\"font-weight: 400;\">&gt;<\/span>\n<span style=\"font-weight: 400;\"> &nbsp; &nbsp; &lt;<\/span><span style=\"font-weight: 400;\">form<\/span><span style=\"font-weight: 400;\">&gt;<\/span>\n<span style=\"font-weight: 400;\"> &nbsp; &nbsp; &nbsp; &lt;<\/span><span style=\"font-weight: 400;\">div<\/span><span style=\"font-weight: 400;\"> class=<\/span><span style=\"font-weight: 400;\">\"mb-3\"<\/span><span style=\"font-weight: 400;\">&gt;<\/span>\n<span style=\"font-weight: 400;\"> &nbsp; &nbsp; &nbsp; &nbsp; &lt;<\/span><span style=\"font-weight: 400;\">label<\/span><span style=\"font-weight: 400;\"> for=<\/span><span style=\"font-weight: 400;\">\"exampleInputEmail1\"<\/span><span style=\"font-weight: 400;\"> class=<\/span><span style=\"font-weight: 400;\">\"form-label\"<\/span><span style=\"font-weight: 400;\">&gt;Email address&lt;\/<\/span><span style=\"font-weight: 400;\">label<\/span><span style=\"font-weight: 400;\">&gt;<\/span>\n<span style=\"font-weight: 400;\"> &nbsp; &nbsp; &nbsp; &nbsp; &lt;<\/span><span style=\"font-weight: 400;\">input<\/span><span style=\"font-weight: 400;\"> type=<\/span><span style=\"font-weight: 400;\">\"email\"<\/span><span style=\"font-weight: 400;\"> class=<\/span><span style=\"font-weight: 400;\">\"form-control\"<\/span><span style=\"font-weight: 400;\"> id=<\/span><span style=\"font-weight: 400;\">\"exampleInputEmail1\"<\/span><span style=\"font-weight: 400;\"> aria-describedby=<\/span><span style=\"font-weight: 400;\">\"emailHelp\"<\/span><span style=\"font-weight: 400;\">&gt;<\/span>\n<span style=\"font-weight: 400;\"> &nbsp; &nbsp; &nbsp; &nbsp; &lt;<\/span><span style=\"font-weight: 400;\">div<\/span><span style=\"font-weight: 400;\"> id=<\/span><span style=\"font-weight: 400;\">\"emailHelp\"<\/span><span style=\"font-weight: 400;\"> class=<\/span><span style=\"font-weight: 400;\">\"form-text\"<\/span><span style=\"font-weight: 400;\">&gt;We'll never share your email with anyone else.&lt;\/<\/span><span style=\"font-weight: 400;\">div<\/span><span style=\"font-weight: 400;\">&gt;<\/span>\n<span style=\"font-weight: 400;\"> &nbsp; &nbsp; &nbsp; &lt;\/<\/span><span style=\"font-weight: 400;\">div<\/span><span style=\"font-weight: 400;\">&gt;<\/span>\n<span style=\"font-weight: 400;\"> &nbsp; &nbsp; &nbsp; &lt;<\/span><span style=\"font-weight: 400;\">div<\/span><span style=\"font-weight: 400;\"> class=<\/span><span style=\"font-weight: 400;\">\"mb-3\"<\/span><span style=\"font-weight: 400;\">&gt;<\/span>\n<span style=\"font-weight: 400;\"> &nbsp; &nbsp; &nbsp; &nbsp; &lt;<\/span><span style=\"font-weight: 400;\">label<\/span><span style=\"font-weight: 400;\"> for=<\/span><span style=\"font-weight: 400;\">\"exampleInputPassword1\"<\/span><span style=\"font-weight: 400;\"> class=<\/span><span style=\"font-weight: 400;\">\"form-label\"<\/span><span style=\"font-weight: 400;\">&gt;Password&lt;\/<\/span><span style=\"font-weight: 400;\">label<\/span><span style=\"font-weight: 400;\">&gt;<\/span>\n<span style=\"font-weight: 400;\"> &nbsp; &nbsp; &nbsp; &nbsp; &lt;<\/span><span style=\"font-weight: 400;\">input<\/span><span style=\"font-weight: 400;\"> type=<\/span><span style=\"font-weight: 400;\">\"password\"<\/span><span style=\"font-weight: 400;\"> class=<\/span><span style=\"font-weight: 400;\">\"form-control\"<\/span><span style=\"font-weight: 400;\"> id=<\/span><span style=\"font-weight: 400;\">\"exampleInputPassword1\"<\/span><span style=\"font-weight: 400;\">&gt;<\/span>\n<span style=\"font-weight: 400;\"> &nbsp; &nbsp; &nbsp; &lt;\/<\/span><span style=\"font-weight: 400;\">div<\/span><span style=\"font-weight: 400;\">&gt;<\/span>\n<span style=\"font-weight: 400;\"> &nbsp; &nbsp; &nbsp; &lt;<\/span><span style=\"font-weight: 400;\">button<\/span><span style=\"font-weight: 400;\"> type=<\/span><span style=\"font-weight: 400;\">\"submit\"<\/span><span style=\"font-weight: 400;\"> class=<\/span><span style=\"font-weight: 400;\">\"btn btn-primary\"<\/span><span style=\"font-weight: 400;\">&gt;Submit&lt;\/<\/span><span style=\"font-weight: 400;\">button<\/span><span style=\"font-weight: 400;\">&gt;<\/span>\n<span style=\"font-weight: 400;\"> &nbsp; &nbsp; &lt;\/<\/span><span style=\"font-weight: 400;\">form<\/span><span style=\"font-weight: 400;\">&gt;<\/span>\n<span style=\"font-weight: 400;\"> &nbsp; &lt;\/<\/span><span style=\"font-weight: 400;\">div<\/span><span style=\"font-weight: 400;\">&gt;<\/span><\/code><\/pre>\n\n\n\n<p><span style=\"font-weight: 400;\">Trong \u0111\u00f3:<\/span><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><span style=\"font-weight: 400;\">S\u1eed d\u1ee5ng <\/span><b>.form-control <\/b><span style=\"font-weight: 400;\">\u0111\u1ec3 \u0111\u1ecbnh d\u1ea1ng \u00f4 nh\u1eadp chuy\u00ean nghi\u1ec7p<\/span><\/li>\n\n\n\n<li><span style=\"font-weight: 400;\">S\u1eed d\u1ee5ng <\/span><b>btn btn-primary<\/b><span style=\"font-weight: 400;\"> t\u1ea1o n\u00fat n\u1ed5i b\u1eadt<\/span><\/li>\n\n\n\n<li><b>w-25<\/b><span style=\"font-weight: 400;\"> gi\u1edbi h\u1ea1n chi\u1ec1u r\u1ed9ng form<\/span><\/li>\n<\/ul>\n\n\n\n<p><span style=\"font-weight: 400;\">H\u00ecnh \u1ea3nh k\u1ebft qu\u1ea3:<\/span><\/p>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"556\" height=\"273\" src=\"\/blog\/wp-content\/uploads\/2025\/03\/bootstrap-forms-example-vippro.png\" alt=\"bootstrap - v\u00ed d\u1ee5 forms - itviec blog\" class=\"wp-image-85138\" srcset=\"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/03\/bootstrap-forms-example-vippro.png 556w, https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/03\/bootstrap-forms-example-vippro-300x147.png 300w, https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/03\/bootstrap-forms-example-vippro-200x98.png 200w\" sizes=\"auto, (max-width: 556px) 100vw, 556px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-t\u1ea1o-m\u1ed9t-th\u1ebb-thong-tin\"><b>T\u1ea1o m\u1ed9t th\u1ebb th\u00f4ng tin<\/b><\/h3>\n\n\n\n<pre class=\"wp-block-code\"><code><span style=\"font-weight: 400;\">&nbsp; &nbsp; &nbsp; &lt;<\/span><span style=\"font-weight: 400;\">div<\/span><span style=\"font-weight: 400;\"> class=<\/span><span style=\"font-weight: 400;\">\"card\"<\/span><span style=\"font-weight: 400;\">&gt;<\/span>\n<span style=\"font-weight: 400;\">&nbsp; &nbsp; &nbsp; &nbsp; &lt;<\/span><span style=\"font-weight: 400;\">div<\/span><span style=\"font-weight: 400;\"> class=<\/span><span style=\"font-weight: 400;\">\"card-body\"<\/span><span style=\"font-weight: 400;\">&gt;<\/span>\n<span style=\"font-weight: 400;\">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &lt;<\/span><span style=\"font-weight: 400;\">h5<\/span><span style=\"font-weight: 400;\"> class=<\/span><span style=\"font-weight: 400;\">\"card-title\"<\/span><span style=\"font-weight: 400;\">&gt;Card title&lt;\/<\/span><span style=\"font-weight: 400;\">h5<\/span><span style=\"font-weight: 400;\">&gt;<\/span>\n<span style=\"font-weight: 400;\">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &lt;<\/span><span style=\"font-weight: 400;\">p<\/span><span style=\"font-weight: 400;\"> class=<\/span><span style=\"font-weight: 400;\">\"card-text\"<\/span><span style=\"font-weight: 400;\">&gt;Some quick example text to build on the card title and make up the bulk of the card's content.&lt;\/<\/span><span style=\"font-weight: 400;\">p<\/span><span style=\"font-weight: 400;\">&gt;<\/span>\n<span style=\"font-weight: 400;\">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &lt;<\/span><span style=\"font-weight: 400;\">a<\/span><span style=\"font-weight: 400;\"> href=<\/span><span style=\"font-weight: 400;\">\"#\"<\/span><span style=\"font-weight: 400;\"> class=<\/span><span style=\"font-weight: 400;\">\"btn btn-primary\"<\/span><span style=\"font-weight: 400;\">&gt;Go somewhere&lt;\/<\/span><span style=\"font-weight: 400;\">a<\/span><span style=\"font-weight: 400;\">&gt;<\/span>\n<span style=\"font-weight: 400;\">&nbsp; &nbsp; &nbsp; &nbsp; &lt;\/<\/span><span style=\"font-weight: 400;\">div<\/span><span style=\"font-weight: 400;\">&gt;<\/span>\n<span style=\"font-weight: 400;\">&nbsp; &nbsp; &nbsp; &lt;\/<\/span><span style=\"font-weight: 400;\">div<\/span><span style=\"font-weight: 400;\">&gt;<\/span><\/code><\/pre>\n\n\n\n<p><span style=\"font-weight: 400;\">Trong \u0111\u00f3:<\/span><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><b>card<\/b><span style=\"font-weight: 400;\">: T\u1ea1o m\u1ed9t th\u1ebb (card) ch\u1ee9a n\u1ed9i dung c\u00f3 khung vi\u1ec1n<\/span><\/li>\n\n\n\n<li><b>card-body<\/b><span style=\"font-weight: 400;\">: Ch\u1ee9a n\u1ed9i dung b\u00ean trong card<\/span><\/li>\n\n\n\n<li><b>card-title<\/b><span style=\"font-weight: 400;\">: Ti\u00eau \u0111\u1ec1 c\u1ee7a card<\/span><\/li>\n\n\n\n<li><b>card-text<\/b><span style=\"font-weight: 400;\">: \u0110o\u1ea1n v\u0103n b\u1ea3n m\u00f4 t\u1ea3 n\u1ed9i dung card<\/span><\/li>\n\n\n\n<li><b>btn btn-primary<\/b><span style=\"font-weight: 400;\">: N\u00fat m\u00e0u xanh \u0111\u1ec3 \u0111i\u1ec1u h\u01b0\u1edbng ho\u1eb7c th\u1ef1c hi\u1ec7n h\u00e0nh \u0111\u1ed9ng<\/span><\/li>\n<\/ul>\n\n\n\n<p><span style=\"font-weight: 400;\">H\u00ecnh \u1ea3nh k\u1ebft qu\u1ea3:<\/span><\/p>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"506\" height=\"202\" src=\"\/blog\/wp-content\/uploads\/2025\/03\/bootstrap-card-example-vippro.png\" alt=\"bootstrap - v\u00ed d\u1ee5 card - itviec blog\" class=\"wp-image-85139\" srcset=\"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/03\/bootstrap-card-example-vippro.png 506w, https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/03\/bootstrap-card-example-vippro-300x120.png 300w, https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/03\/bootstrap-card-example-vippro-200x80.png 200w\" sizes=\"auto, (max-width: 506px) 100vw, 506px\" \/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-so-sanh-bootstrap-v\u1edbi-cac-framework-khac\"><span class=\"ez-toc-section\" id=\"So_sanh_Bootstrap_voi_cac_framework_khac\"><\/span><b>So s\u00e1nh Bootstrap v\u1edbi c\u00e1c framework kh\u00e1c<\/b><span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<figure class=\"wp-block-table\"><table class=\"has-fixed-layout\"><tbody><tr><td><b>Framework<\/b><\/td><td><b>\u01afu \u0111i\u1ec3m<\/b><\/td><td><b>Nh\u01b0\u1ee3c \u0111i\u1ec3m<\/b><\/td><td><b>\u0110\u1ed1i t\u01b0\u1ee3ng ph\u00f9 h\u1ee3p<\/b><\/td><\/tr><tr><td><b>Bootstrap<\/b><\/td><td><span style=\"font-weight: 400;\">Ph\u1ed5 bi\u1ebfn, d\u1ec5 d\u00f9ng, nhi\u1ec1u th\u00e0nh ph\u1ea7n UI, h\u1ed7 tr\u1ee3 JavaScript, c\u1ed9ng \u0111\u1ed3ng l\u1edbn<\/span><\/td><td><span style=\"font-weight: 400;\">N\u1eb7ng, kh\u00f3 t\u00f9y ch\u1ec9nh s\u00e2u n\u1ebfu kh\u00f4ng d\u00f9ng SCSS<\/span><\/td><td><span style=\"font-weight: 400;\">Ng\u01b0\u1eddi m\u1edbi, d\u1ef1 \u00e1n nhanh, web responsive<\/span><\/td><\/tr><tr><td><b>Tailwind CSS<\/b><\/td><td><span style=\"font-weight: 400;\">T\u00f9y ch\u1ec9nh linh ho\u1ea1t, utility-first, t\u1ed1i \u01b0u performance<\/span><\/td><td><span style=\"font-weight: 400;\">C\u1ea7n nh\u1edb nhi\u1ec1u class, kh\u00f4ng c\u00f3 UI s\u1eb5n<\/span><\/td><td><span style=\"font-weight: 400;\">L\u1eadp tr\u00ecnh vi\u00ean th\u00edch t\u1ed1i \u01b0u code, thi\u1ebft k\u1ebf custom<\/span><\/td><\/tr><tr><td><b>Bulma<\/b><\/td><td><span style=\"font-weight: 400;\">Nh\u1eb9, d\u1ec5 h\u1ecdc, h\u1ed7 tr\u1ee3 Flexbox, c\u00fa ph\u00e1p \u0111\u01a1n gi\u1ea3n<\/span><\/td><td><span style=\"font-weight: 400;\">\u00cdt th\u00e0nh ph\u1ea7n UI h\u01a1n Bootstrap, ch\u01b0a ph\u1ed5 bi\u1ebfn b\u1eb1ng<\/span><\/td><td><span style=\"font-weight: 400;\">D\u1ef1 \u00e1n nh\u1ecf, ng\u01b0\u1eddi m\u1edbi<\/span><\/td><\/tr><tr><td><b>Material UI<\/b><\/td><td><span style=\"font-weight: 400;\">UI theo chu\u1ea9n Google Material, h\u1ed7 tr\u1ee3 React, nhi\u1ec1u component \u0111\u1eb9p<\/span><\/td><td><span style=\"font-weight: 400;\">Ph\u1ee5 thu\u1ed9c v\u00e0o React, h\u01a1i n\u1eb7ng<\/span><\/td><td><span style=\"font-weight: 400;\">D\u1ef1 \u00e1n d\u00f9ng React, UI theo Google Material<\/span><\/td><\/tr><tr><td><b>Foundation<\/b><\/td><td><span style=\"font-weight: 400;\">Responsive m\u1ea1nh, h\u1ed7 tr\u1ee3 email template, grid system n\u00e2ng cao<\/span><\/td><td><span style=\"font-weight: 400;\">H\u1ecdc kh\u00f3 h\u01a1n, \u00edt ph\u1ed5 bi\u1ebfn<\/span><\/td><td><span style=\"font-weight: 400;\">D\u1ef1 \u00e1n l\u1edbn, c\u1ea7n UI ph\u1ee9c t\u1ea1p<\/span><\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-cau-h\u1ecfi-th\u01b0\u1eddng-g\u1eb7p-v\u1ec1-bootstrap-la-gi\"><span class=\"ez-toc-section\" id=\"Cau_hoi_thuong_gap_ve_Bootstrap_la_gi\"><\/span><b>C\u00e2u h\u1ecfi th\u01b0\u1eddng g\u1eb7p v\u1ec1 Bootstrap l\u00e0 g\u00ec<\/b><span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-bootstrap-co-th\u1ec3-tuy-ch\u1ec9nh-khong\"><b>Bootstrap c\u00f3 th\u1ec3 t\u00f9y ch\u1ec9nh kh\u00f4ng?<\/b><\/h3>\n\n\n\n<p><span style=\"font-weight: 400;\">Bootstrap ho\u00e0n to\u00e0n c\u00f3 th\u1ec3 t\u00f9y ch\u1ec9nh theo nhu c\u1ea7u b\u1eb1ng nhi\u1ec1u c\u00e1ch kh\u00e1c nhau nh\u01b0:<\/span><\/p>\n\n\n\n<h4 class=\"wp-block-heading\" id=\"h-ghi-de-css-m\u1eb7c-d\u1ecbnh\"><span style=\"font-weight: 400;\"><strong>Ghi \u0111\u00e8 CSS m\u1eb7c \u0111\u1ecbnh:<\/strong><\/span><\/h4>\n\n\n\n<p><span style=\"font-weight: 400;\">S\u1eed d\u1ee5ng c\u00e1c thu\u1ed9c t\u00ednh CSS m\u1edbi \u0111\u1ec3 \u00e1p d\u1ee5ng cho c\u00e1c class c\u00f3 s\u1eb5n c\u1ee7a bootstrap.<\/span><\/p>\n\n\n\n<p><span style=\"font-weight: 400;\">V\u00ed d\u1ee5: thay \u0111\u1ed5i m\u00e0u c\u1ee7a button primary<\/span><\/p>\n\n\n\n<pre class=\"wp-block-code\"><code><span style=\"font-weight: 400;\">.btn-primary<\/span><span style=\"font-weight: 400;\"> {<\/span>\n<span style=\"font-weight: 400;\">&nbsp; &nbsp; <\/span><span style=\"font-weight: 400;\">background-color<\/span><span style=\"font-weight: 400;\">: <\/span><span style=\"font-weight: 400;\">#ff5722<\/span> <span style=\"font-weight: 400;\">!important<\/span><span style=\"font-weight: 400;\">; <\/span><span style=\"font-weight: 400;\">\/* \u0110\u1ed5i th\u00e0nh cam *\/<\/span>\n<span style=\"font-weight: 400;\">&nbsp; &nbsp; <\/span><span style=\"font-weight: 400;\">font-size<\/span><span style=\"font-weight: 400;\">: <\/span><span style=\"font-weight: 400;\">18px<\/span><span style=\"font-weight: 400;\">; <\/span><span style=\"font-weight: 400;\">\/* T\u0103ng k\u00edch th\u01b0\u1edbc ch\u1eef *\/<\/span>\n<span style=\"font-weight: 400;\">}<\/span><\/code><\/pre>\n\n\n\n<h4 class=\"wp-block-heading\" id=\"h-thay-d\u1ed5i-bi\u1ebfn-c\u1ee7a-bootstrap\"><strong>Thay \u0111\u1ed5i bi\u1ebfn c\u1ee7a bootstrap:<\/strong><\/h4>\n\n\n\n<p><span style=\"font-weight: 400;\">S\u1eed d\u1ee5ng SCSS (SASS) gi\u00fap thay \u0111\u1ed5i bi\u1ebfn m\u00e0u, font, kho\u1ea3ng c\u00e1ch.<\/span><\/p>\n\n\n\n<p><span style=\"font-weight: 400;\">V\u00ed d\u1ee5: thay \u0111\u1ed5i m\u00e0u s\u1eafc trong SCSS<\/span><\/p>\n\n\n\n<pre class=\"wp-block-code\"><code><span style=\"font-weight: 400;\">$primary<\/span><span style=\"font-weight: 400;\">: <\/span><span style=\"font-weight: 400;\">#ff5722<\/span><span style=\"font-weight: 400;\">; <\/span><span style=\"font-weight: 400;\">\/\/ \u0110\u1ed5i m\u00e0u ch\u00ednh th\u00e0nh cam<\/span>\n<span style=\"font-weight: 400;\">$secondary: #00bcd4; \/\/ \u0110\u1ed5i m\u00e0u ph\u1ee5 th\u00e0nh xanh<\/span>\n<span style=\"font-weight: 400;\">@import \"bootstrap\";<\/span><\/code><\/pre>\n\n\n\n<h4 class=\"wp-block-heading\" id=\"h-tuy-ch\u1ec9nh-javascript\"><strong>T\u00f9y ch\u1ec9nh javascript:<\/strong><\/h4>\n\n\n\n<p><span style=\"font-weight: 400;\">T\u00f9y ch\u1ec9nh h\u00e0nh vi c\u1ee7a modal, tooltip, carousel,&#8230; b\u1eb1ng c\u00e1ch truy\u1ec1n options ho\u1eb7c s\u1eed d\u1ee5ng JavaScript API.<\/span><\/p>\n\n\n\n<p><span style=\"font-weight: 400;\">V\u00ed d\u1ee5: T\u1eaft t\u00ednh n\u0103ng \u0111\u00f3ng modal khi nh\u1ea5n ESC<\/span><\/p>\n\n\n\n<pre class=\"wp-block-preformatted\"><span style=\"font-weight: 400;\">$('<\/span><span style=\"font-weight: 400;\">#myModal<\/span><span style=\"font-weight: 400;\">')<\/span><span style=\"font-weight: 400;\">.modal<\/span><span style=\"font-weight: 400;\">({ keyboard: false });<\/span><\/pre>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-phien-b\u1ea3n-m\u1edbi-nh\u1ea5t-c\u1ee7a-bootstrap-la-gi\"><b>Phi\u00ean b\u1ea3n m\u1edbi nh\u1ea5t c\u1ee7a Bootstrap l\u00e0 g\u00ec?<\/b><\/h3>\n\n\n\n<p><span style=\"font-weight: 400;\">Phi\u00ean b\u1ea3n m\u1edbi nh\u1ea5t c\u1ee7a Bootstrap l\u00e0 5.3.3, ph\u00e1t h\u00e0nh ng\u00e0y 20 th\u00e1ng 2 n\u0103m 2024, mang \u0111\u1ebfn m\u1ed9t s\u1ed1 c\u1ea3i ti\u1ebfn v\u00e0 s\u1eeda l\u1ed7i quan tr\u1ecdng nh\u01b0 c\u1ea3i ti\u1ebfn ch\u1ebf \u0111\u1ed9 m\u00e0u, kh\u1eafc ph\u1ee5c l\u1ed7i trong c\u00f4ng c\u1ee5 ch\u1ecdn, c\u1ea3i thi\u1ec7n th\u00e0nh ph\u1ea7n Accordion,&#8230;<\/span><\/p>\n\n\n\n<p><span style=\"font-weight: 400;\">B\u1ea1n c\u00f3 th\u1ec3 xem danh s\u00e1ch c\u00e1c phi\u00ean b\u1ea3n c\u1ee7a Bootstrap t\u1ea1i \u0111\u00e2y: <\/span><a href=\"https:\/\/getbootstrap.com\/docs\/versions\/\" target=\"_blank\" rel=\"noopener\"><span style=\"font-weight: 400;\">https:\/\/getbootstrap.com\/docs\/versions\/<\/span><\/a><span style=\"font-weight: 400;\">&nbsp;<\/span><\/p>\n\n\n\n<h3 class=\"wp-block-heading\" id=\"h-bootstrap-co-mi\u1ec5n-phi-khong\"><b>Bootstrap c\u00f3 mi\u1ec5n ph\u00ed kh\u00f4ng?<\/b><\/h3>\n\n\n\n<p><span style=\"font-weight: 400;\">Bootstrap ho\u00e0n to\u00e0n mi\u1ec5n ph\u00ed v\u00e0 \u0111\u01b0\u1ee3c ph\u00e1t h\u00e0nh theo gi\u1ea5y ph\u00e9p MIT. B\u1ea1n c\u00f3 th\u1ec3 s\u1eed d\u1ee5ng Bootstrap mi\u1ec5n ph\u00ed cho c\u1ea3 d\u1ef1 \u00e1n c\u00e1 nh\u00e2n hay th\u01b0\u01a1ng m\u1ea1i v\u00e0 c\u00f3 th\u1ec3 ch\u1ec9nh s\u1eeda, t\u00f9y ch\u1ec9nh v\u00e0 ph\u00e2n ph\u1ed1i l\u1ea1i theo nhu c\u1ea7u.<\/span><\/p>\n\n\n\n<h2 class=\"wp-block-heading\" id=\"h-t\u1ed5ng-k\u1ebft-bootstrap-la-gi\"><span class=\"ez-toc-section\" id=\"Tong_ket_Bootstrap_la_gi\"><\/span><b>T\u1ed5ng k\u1ebft Bootstrap l\u00e0 g\u00ec<\/b><span class=\"ez-toc-section-end\"><\/span><\/h2>\n\n\n\n<p><span style=\"font-weight: 400;\">V\u1edbi h\u1ec7 th\u1ed1ng l\u01b0\u1edbi linh ho\u1ea1t, c\u00e1c th\u00e0nh ph\u1ea7n UI phong ph\u00fa v\u00e0 th\u01b0 vi\u1ec7n JavaScript t\u00edch h\u1ee3p, Bootstrap \u0111\u00e3 tr\u1edf th\u00e0nh m\u1ed9t framework front-end m\u1ea1nh m\u1ebd gi\u00fap l\u1eadp tr\u00ecnh vi\u00ean x\u00e2y d\u1ef1ng giao di\u1ec7n web nhanh ch\u00f3ng, chuy\u00ean nghi\u1ec7p v\u00e0 t\u01b0\u01a1ng th\u00edch t\u1ed1t tr\u00ean m\u1ecdi thi\u1ebft b\u1ecb. Qua b\u00e0i vi\u1ebft n\u00e0y, ITviec hi v\u1ecdng c\u00f3 th\u1ec3 gi\u00fap b\u1ea1n hi\u1ec3u Bootstrap l\u00e0 g\u00ec v\u00e0 c\u00f3 m\u1ed9t c\u00e1ch nh\u00ecn t\u1ed5ng quan v\u1ec1 framework n\u1ed5i ti\u1ebfng n\u00e0y \u0111\u1ec3 t\u1eebng b\u01b0\u1edbc chinh ph\u1ee5c n\u00f3 v\u00e0 n\u00e2ng cao k\u1ef9 n\u0103ng c\u1ee7a b\u1ea3n th\u00e2n.<\/span><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Trong l\u0129nh v\u1ef1c ph\u00e1t tri\u1ec3n ph\u1ea7n m\u1ec1m ng\u00e0y nay, vi\u1ec7c t\u1ea1o ra nh\u1eefng giao di\u1ec7n web \u0111\u1eb9p m\u1eaft, chuy\u00ean nghi\u1ec7p, t\u1ea1o s\u1ef1 thu\u1eadn ti\u1ec7n cho ng\u01b0\u1eddi d\u00f9ng l\u00e0 \u0111i\u1ec1u v\u00f4 c\u00f9ng quan tr\u1ecdng. Bootstrap ch\u00ednh l\u00e0 m\u1ed9t trong nh\u1eefng c\u00f4ng c\u1ee5 h\u1eefu \u00edch gi\u00fap c\u00e1c l\u1eadp tr\u00ecnh vi\u00ean l\u00e0m \u0111\u01b0\u1ee3c \u0111i\u1ec1u \u0111\u00f3. V\u1eady th\u00ec Bootstrap [&hellip;]<\/p>\n","protected":false},"author":235,"featured_media":85337,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_gspb_post_css":"","footnotes":""},"categories":[109],"tags":[],"class_list":["post-85110","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-chuyen-mon-it"],"blocksy_meta":[],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v26.8 (Yoast SEO v27.8) - https:\/\/yoast.com\/product\/yoast-seo-premium-wordpress\/ -->\n<title>Bootstrap l\u00e0 g\u00ec? 7 t\u00ednh n\u0103ng c\u1ea7n bi\u1ebft trong Bootstrap - ITviec Blog<\/title>\n<meta name=\"description\" content=\"T\u00ecm hi\u1ec3u framework Bootstrap l\u00e0 g\u00ec c\u00f9ng c\u00e1c t\u00ednh n\u0103ng Bootstrap quan tr\u1ecdng k\u00e8m v\u00ed d\u1ee5 \u0111\u1ec3 x\u00e2y d\u1ef1ng giao di\u1ec7n web nhanh ch\u00f3ng v\u00e0 hi\u1ec7u qu\u1ea3.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/itviec.com\/blog\/bootstrap-la-gi\/\" \/>\n<meta property=\"og:locale\" content=\"vi_VN\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Bootstrap l\u00e0 g\u00ec? 7 t\u00ednh n\u0103ng c\u1ea7n bi\u1ebft trong Bootstrap\" \/>\n<meta property=\"og:description\" content=\"Trong l\u0129nh v\u1ef1c ph\u00e1t tri\u1ec3n ph\u1ea7n m\u1ec1m ng\u00e0y nay, vi\u1ec7c t\u1ea1o ra nh\u1eefng giao di\u1ec7n web \u0111\u1eb9p m\u1eaft, chuy\u00ean nghi\u1ec7p, t\u1ea1o s\u1ef1 thu\u1eadn ti\u1ec7n cho ng\u01b0\u1eddi d\u00f9ng l\u00e0 \u0111i\u1ec1u v\u00f4 c\u00f9ng quan\" \/>\n<meta property=\"og:url\" content=\"https:\/\/itviec.com\/blog\/bootstrap-la-gi\/\" \/>\n<meta property=\"og:site_name\" content=\"ITviec Blog\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/ITviec\" \/>\n<meta property=\"article:published_time\" content=\"2025-03-27T09:45:48+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2025-07-10T03:56:37+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/03\/bootstrap-la-gi-vippro-scaled.png\" \/>\n\t<meta property=\"og:image:width\" content=\"640\" \/>\n\t<meta property=\"og:image:height\" content=\"337\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Ph\u1ea1m H\u1eefu Ng\u1ecdc\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@ITviec\" \/>\n<meta name=\"twitter:site\" content=\"@ITviec\" \/>\n<meta name=\"twitter:label1\" content=\"\u0110\u01b0\u1ee3c vi\u1ebft b\u1edfi\" \/>\n\t<meta name=\"twitter:data1\" content=\"Ph\u1ea1m H\u1eefu Ng\u1ecdc\" \/>\n\t<meta name=\"twitter:label2\" content=\"\u01af\u1edbc t\u00ednh th\u1eddi gian \u0111\u1ecdc\" \/>\n\t<meta name=\"twitter:data2\" content=\"16 ph\u00fat\" \/>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Bootstrap l\u00e0 g\u00ec? 7 t\u00ednh n\u0103ng c\u1ea7n bi\u1ebft trong Bootstrap - ITviec Blog","description":"T\u00ecm hi\u1ec3u framework Bootstrap l\u00e0 g\u00ec c\u00f9ng c\u00e1c t\u00ednh n\u0103ng Bootstrap quan tr\u1ecdng k\u00e8m v\u00ed d\u1ee5 \u0111\u1ec3 x\u00e2y d\u1ef1ng giao di\u1ec7n web nhanh ch\u00f3ng v\u00e0 hi\u1ec7u qu\u1ea3.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/itviec.com\/blog\/bootstrap-la-gi\/","og_locale":"vi_VN","og_type":"article","og_title":"Bootstrap l\u00e0 g\u00ec? 7 t\u00ednh n\u0103ng c\u1ea7n bi\u1ebft trong Bootstrap","og_description":"Trong l\u0129nh v\u1ef1c ph\u00e1t tri\u1ec3n ph\u1ea7n m\u1ec1m ng\u00e0y nay, vi\u1ec7c t\u1ea1o ra nh\u1eefng giao di\u1ec7n web \u0111\u1eb9p m\u1eaft, chuy\u00ean nghi\u1ec7p, t\u1ea1o s\u1ef1 thu\u1eadn ti\u1ec7n cho ng\u01b0\u1eddi d\u00f9ng l\u00e0 \u0111i\u1ec1u v\u00f4 c\u00f9ng quan","og_url":"https:\/\/itviec.com\/blog\/bootstrap-la-gi\/","og_site_name":"ITviec Blog","article_publisher":"https:\/\/www.facebook.com\/ITviec","article_published_time":"2025-03-27T09:45:48+00:00","article_modified_time":"2025-07-10T03:56:37+00:00","og_image":[{"width":640,"height":337,"url":"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/03\/bootstrap-la-gi-vippro-scaled.png","type":"image\/png"}],"author":"Ph\u1ea1m H\u1eefu Ng\u1ecdc","twitter_card":"summary_large_image","twitter_creator":"@ITviec","twitter_site":"@ITviec","twitter_misc":{"\u0110\u01b0\u1ee3c vi\u1ebft b\u1edfi":"Ph\u1ea1m H\u1eefu Ng\u1ecdc","\u01af\u1edbc t\u00ednh th\u1eddi gian \u0111\u1ecdc":"16 ph\u00fat"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/itviec.com\/blog\/bootstrap-la-gi\/#article","isPartOf":{"@id":"https:\/\/itviec.com\/blog\/bootstrap-la-gi\/"},"author":{"name":"Ph\u1ea1m H\u1eefu Ng\u1ecdc","@id":"https:\/\/itviec.com\/blog\/#\/schema\/person\/407769a7625b7f955cef615f7a99abad"},"headline":"Bootstrap l\u00e0 g\u00ec? 7 t\u00ednh n\u0103ng c\u1ea7n bi\u1ebft trong Bootstrap","datePublished":"2025-03-27T09:45:48+00:00","dateModified":"2025-07-10T03:56:37+00:00","mainEntityOfPage":{"@id":"https:\/\/itviec.com\/blog\/bootstrap-la-gi\/"},"wordCount":3724,"publisher":{"@id":"https:\/\/itviec.com\/blog\/#organization"},"image":{"@id":"https:\/\/itviec.com\/blog\/bootstrap-la-gi\/#primaryimage"},"thumbnailUrl":"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/03\/bootstrap-la-gi-vippro-scaled.png","articleSection":["Chuy\u00ean m\u00f4n IT"],"inLanguage":"vi"},{"@type":"WebPage","@id":"https:\/\/itviec.com\/blog\/bootstrap-la-gi\/","url":"https:\/\/itviec.com\/blog\/bootstrap-la-gi\/","name":"Bootstrap l\u00e0 g\u00ec? 7 t\u00ednh n\u0103ng c\u1ea7n bi\u1ebft trong Bootstrap - ITviec Blog","isPartOf":{"@id":"https:\/\/itviec.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/itviec.com\/blog\/bootstrap-la-gi\/#primaryimage"},"image":{"@id":"https:\/\/itviec.com\/blog\/bootstrap-la-gi\/#primaryimage"},"thumbnailUrl":"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/03\/bootstrap-la-gi-vippro-scaled.png","datePublished":"2025-03-27T09:45:48+00:00","dateModified":"2025-07-10T03:56:37+00:00","description":"T\u00ecm hi\u1ec3u framework Bootstrap l\u00e0 g\u00ec c\u00f9ng c\u00e1c t\u00ednh n\u0103ng Bootstrap quan tr\u1ecdng k\u00e8m v\u00ed d\u1ee5 \u0111\u1ec3 x\u00e2y d\u1ef1ng giao di\u1ec7n web nhanh ch\u00f3ng v\u00e0 hi\u1ec7u qu\u1ea3.","breadcrumb":{"@id":"https:\/\/itviec.com\/blog\/bootstrap-la-gi\/#breadcrumb"},"inLanguage":"vi","potentialAction":[{"@type":"ReadAction","target":["https:\/\/itviec.com\/blog\/bootstrap-la-gi\/"]}]},{"@type":"ImageObject","inLanguage":"vi","@id":"https:\/\/itviec.com\/blog\/bootstrap-la-gi\/#primaryimage","url":"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/03\/bootstrap-la-gi-vippro-scaled.png","contentUrl":"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2025\/03\/bootstrap-la-gi-vippro-scaled.png","width":640,"height":337,"caption":"bootstrap l\u00e0 g\u00ec - itviec blog"},{"@type":"BreadcrumbList","@id":"https:\/\/itviec.com\/blog\/bootstrap-la-gi\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Chuy\u00ean m\u00f4n IT","item":"https:\/\/itviec.com\/blog\/chuyen-mon-it\/"},{"@type":"ListItem","position":2,"name":"Bootstrap l\u00e0 g\u00ec? 7 t\u00ednh n\u0103ng c\u1ea7n bi\u1ebft trong Bootstrap"}]},{"@type":"WebSite","@id":"https:\/\/itviec.com\/blog\/#website","url":"https:\/\/itviec.com\/blog\/","name":"ITviec Blog","description":"IT Jobs &amp; People in Vietnam","publisher":{"@id":"https:\/\/itviec.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/itviec.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"vi"},{"@type":"Organization","@id":"https:\/\/itviec.com\/blog\/#organization","name":"ITviec","url":"https:\/\/itviec.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"vi","@id":"https:\/\/itviec.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2018\/12\/itviec-black-square-facebook.png","contentUrl":"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2018\/12\/itviec-black-square-facebook.png","width":1800,"height":1800,"caption":"ITviec"},"image":{"@id":"https:\/\/itviec.com\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/ITviec","https:\/\/x.com\/ITviec","https:\/\/www.linkedin.com\/company\/itviec","https:\/\/www.youtube.com\/channel\/UCYthAQ3bcGr57M_ag5gHDvQ"]},{"@type":"Person","@id":"https:\/\/itviec.com\/blog\/#\/schema\/person\/407769a7625b7f955cef615f7a99abad","name":"Ph\u1ea1m H\u1eefu Ng\u1ecdc","image":{"@type":"ImageObject","inLanguage":"vi","@id":"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2024\/03\/Pham-Huu-Ngoc-technical-content-reviewer-e1712135841473-100x100.jpg","url":"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2024\/03\/Pham-Huu-Ngoc-technical-content-reviewer-e1712135841473-100x100.jpg","contentUrl":"https:\/\/itviec.com\/blog\/wp-content\/uploads\/2024\/03\/Pham-Huu-Ngoc-technical-content-reviewer-e1712135841473-100x100.jpg","caption":"Ph\u1ea1m H\u1eefu Ng\u1ecdc"},"url":"https:\/\/itviec.com\/blog\/author\/pham-huu-ngoc-2\/"}]}},"_links":{"self":[{"href":"https:\/\/itviec.com\/blog\/wp-json\/wp\/v2\/posts\/85110","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/itviec.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/itviec.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/itviec.com\/blog\/wp-json\/wp\/v2\/users\/235"}],"replies":[{"embeddable":true,"href":"https:\/\/itviec.com\/blog\/wp-json\/wp\/v2\/comments?post=85110"}],"version-history":[{"count":3,"href":"https:\/\/itviec.com\/blog\/wp-json\/wp\/v2\/posts\/85110\/revisions"}],"predecessor-version":[{"id":89237,"href":"https:\/\/itviec.com\/blog\/wp-json\/wp\/v2\/posts\/85110\/revisions\/89237"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/itviec.com\/blog\/wp-json\/wp\/v2\/media\/85337"}],"wp:attachment":[{"href":"https:\/\/itviec.com\/blog\/wp-json\/wp\/v2\/media?parent=85110"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/itviec.com\/blog\/wp-json\/wp\/v2\/categories?post=85110"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/itviec.com\/blog\/wp-json\/wp\/v2\/tags?post=85110"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}