{"id":1869,"date":"2023-06-08T10:03:59","date_gmt":"2023-06-08T10:03:59","guid":{"rendered":"https:\/\/blog.amt.in\/?p=1869"},"modified":"2023-06-08T10:03:59","modified_gmt":"2023-06-08T10:03:59","slug":"insights-on-bootstrap","status":"publish","type":"post","link":"https:\/\/blog.amt.in\/index.php\/2023\/06\/08\/insights-on-bootstrap\/","title":{"rendered":"Insights on Bootstrap"},"content":{"rendered":"<p>Bootstrap\u00c2\u00a0is a\u00c2\u00a0free and open-source\u00c2\u00a0front-end library for designing\u00c2\u00a0websites\u00c2\u00a0and\u00c2\u00a0web applications. It contains\u00c2\u00a0HTML- and\u00c2\u00a0CSS-based design templates for\u00c2\u00a0typography, forms, buttons, navigation and other interface components, as well as optional\u00c2\u00a0JavaScript\u00c2\u00a0extensions. Unlike many web frameworks, it concerns itself with\u00c2\u00a0front-end development\u00c2\u00a0only.<\/p>\n<p>Bootstrap is modular and consists of a series of\u00c2\u00a0Less style-sheets\u00c2\u00a0that implement the various components of the toolkit. These style-sheets are generally compiled into a bundle and included in web pages, but individual components can be included or removed. Bootstrap provides a number of configuration variables that control things such as color and padding of various components.<\/p>\n<p>Since Bootstrap 2, the Bootstrap documentation has included a customization wizard which generates a customized version of Bootstrap based on the requested components and various settings.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"wp-image-269 alignleft\" src=\"http:\/\/blog.amt.in\/wp-content\/uploads\/2018\/03\/Inside-BLOG-for-BOOTSTRAP.png\" alt=\"\" width=\"385\" height=\"354\" \/><\/p>\n<p>As of Bootstrap 4,\u00c2\u00a0Sass\u00c2\u00a0is used instead of\u00c2\u00a0Less\u00c2\u00a0for the style-sheets.<\/p>\n<p>Each Bootstrap component consists of an HTML structure, CSS declarations, and in some cases accompanying JavaScript code.<\/p>\n<p>Grid system and responsive design comes standard with an 1170\u00c2\u00a0pixel wide\u00c2\u00a0grid layout. Alternatively, the developer can use a variable-width layout. For both cases, the toolkit has four variations to make use of different resolutions and types of devices: mobile phones, portrait and landscape, tablets and PCs with low and high resolution. Each variation adjusts the width of the columns.<\/p>\n<p>Bootstrap provides a set of style-sheets that provide basic style definitions for all key HTML components. These provide a uniform, modern appearance for formatting text, tables and form elements.\u00c2\u00a0In addition to the regular HTML elements, Bootstrap contains other commonly used interface elements. The components are implemented as CSS classes, which must be applied to certain HTML elements in a page.<\/p>\n<p>Bootstrap comes with several JavaScript components in the form of\u00c2\u00a0j Query\u00c2\u00a0plugins. They provide additional user interface elements such as dialog boxes, tool-tips, and carousels. They also extend the functionality of some existing interface elements, including for example an auto-complete function for input fields. In version 1.3, the following JavaScript plugins are supported: Modal, Drop-down, Scroll-spy, Tab, Tool-tip, Popover, Alert, Button, Collapse, Carousel and Type-ahead.<\/p>\n<p>The above is a compilation about Bootstrap from various sites.\u00c2\u00a0 Watch this space for more information on latest trends in Technology.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Bootstrap\u00c2\u00a0is a\u00c2\u00a0free and open-source\u00c2\u00a0front-end library<\/p>\n","protected":false},"author":1,"featured_media":1871,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[91,342,7],"tags":[93,81,18],"class_list":["post-1869","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-bootstrap","category-open-source","category-techtrends","tag-bootstrap","tag-open-source","tag-technology"],"_links":{"self":[{"href":"https:\/\/blog.amt.in\/index.php\/wp-json\/wp\/v2\/posts\/1869","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/blog.amt.in\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blog.amt.in\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blog.amt.in\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/blog.amt.in\/index.php\/wp-json\/wp\/v2\/comments?post=1869"}],"version-history":[{"count":1,"href":"https:\/\/blog.amt.in\/index.php\/wp-json\/wp\/v2\/posts\/1869\/revisions"}],"predecessor-version":[{"id":1870,"href":"https:\/\/blog.amt.in\/index.php\/wp-json\/wp\/v2\/posts\/1869\/revisions\/1870"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/blog.amt.in\/index.php\/wp-json\/wp\/v2\/media\/1871"}],"wp:attachment":[{"href":"https:\/\/blog.amt.in\/index.php\/wp-json\/wp\/v2\/media?parent=1869"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blog.amt.in\/index.php\/wp-json\/wp\/v2\/categories?post=1869"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blog.amt.in\/index.php\/wp-json\/wp\/v2\/tags?post=1869"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}