UPLOAD

    865

    bootstrap

    Published: November 14, 2019

    Bootstrap is an open source and free CSS framework for Front-End Developers.

    Comments

    bootstrap

    • 1. Slide1
    • 2. WHAT is BOOTSTRAP? WHAT is BOOTSTRAP? Bootstrap is an open source and free CSS framework for Front-End Developers. It has the ability to easily make themes/designs for phones, tablets and desktops that make sites look different and suitable for device size. So you just need to call this structure where everything is ready. Bootstrap works seamlessly by all browsers.
    • 3. WHY BOOTSTRAP? WHY BOOTSTRAP? Mobile first approach: Bootstrap3 consists of Mobile first styles throughout the entire library, rather than a separate file frame. Browser Support: It's easy to get started: With just HTML and CSS knowledge, anyone can start with Bootstrap. Also, the official site of Bootstrap has a good document. It also gives support for JavaScript plugins. Responsive design: Bootstrap's responsive CSS fits Desktops, Tablets and Mobile Phones.
    • 4. WHAT PACKAGE DOES BOOTSTRAP CONTAIN? WHAT PACKAGE DOES BOOTSTRAP CONTAIN? Scaffolding: Bootstrap, Grid System provides a basic structure with connection styles and background. CSS: Bootstrap features global CSS settings, basic HTML elements styled and enhanced with extensible classes, and an advanced grid system. Components: Bootstrap contains over a dozen reusable components built to provide iconography, dropdowns, navigation, alerts, pop-overs, and much more. JavaScript Plugins: Bootstrap contains more than a dozen custom jQuery plugins. You can include them all easily or one by one. Customize: You can customize Bootstrap components, LESS variables, and jQuery plug-ins to get your own version.
    • 5. BOOTSTRAP FILE STRUCTURE BOOTSTRAP FILE STRUCTURE Bootstrap library
    • 6. HOW TO USE BOOTSTRAP? HOW TO USE BOOTSTRAP? First of all, our page should be HTML5. In order to use the Bootstrap library, we need to add it to our project. We can download and add the library to our project as well as using the CDN links. Step 1: Create a basic HTML file. Open your favorite code editor and create a new HTML file. Start with an empty window and type the following code and save it as a .html file on your desktop.
    • 7. HOW TO USE BOOTSTRAP? HOW TO USE BOOTSTRAP? Step 2: Making this HTML File Bootstrap Template To make this Flat HTML file a Bootstrap template, add the necessary jQuery and Popper.js files using Bootstrap CSS and JS files, as well as CDN links. To improve the performance of your webpages, you must add JavaScript files to the end of the page just before the closing tag, as shown in the following example:
    • 8. HOW TO USE BOOTSTRAP? HOW TO USE BOOTSTRAP?
    • 9. BOOTSTRAP GRID SYSTEM BOOTSTRAP GRID SYSTEM Bootstarp includes a responsive, mobile first liquid grid system that is appropriately scaled up to 12 columns as the device or viewport size increases. Includes predefined classes for easy placement options, as well as powerful blends to create more semantic layouts.
    • 10. BOOTSTRAP GRID SYSTEM BOOTSTRAP GRID SYSTEM
    • 11. IS BOOTSTRAP THE BEST FRAMEWORK? IS BOOTSTRAP THE BEST FRAMEWORK? When it comes to CSS frameworks, Bootstrap is at the tip of everyone's language. This toolkit is the most popular of HTML, CSS and JS framework, which is completely popular for developing responsive, mobile first projects on the web.
    • 12. REFERENCES REFERENCES https://www.tutorialrepublic.com/twitter-bootstrap-tutorial/bootstrap-get-started.php[November-2019] https://medium.com/gokhanyavas/bootstrap-nedir-nasıl-kullanılır-a048067c70af[November-2019] https://www.htmlgoodies.com/html5/markup/10-common-uses-of-bootstrap.html[November-2019] https://www.altexsoft.com/blog/engineering/most-popular-responsive-css-frameworks-bootstrap- foundation-materialize-pure-and-more/[November-2019] https://www.tutorialspoint.com/bootstrap/bootstrap_quick_guide.htm[November-2019]