Hey and welcome to the 7th day of Bootstrap 4 🙌🏼 Today we will learn about more Bootstrap 4 form elements. We will go through Bootstrap 4 text inputs and custom inputs like checkboxes, radio buttons and select pickers. It is very likely that you will need to use them when building a web project, so it is useful to know their syntax and special Bootstrap 4 classes.
bootstrap 4
Day 6: Bootstrap 4 Buttons Tutorial and Examples
Hey welcome to a new week of Bootstrap 4 🎉 Today we will learn about Bootstrap 4 buttons, how to use and customise them. Each section will have coded examples and explanations. As a bonus, today you will also navigate through the spacing utilities: how to use Bootstrap 4 classes for margins and padding.
Day 5: Bootstrap 4 Images Tutorial and Examples
Hey and welcome to the 5th day of Bootstrap 4 🤓 Today we will learn about Bootstrap 4 images. Images are an essential part of designing a website. If fitted properly into your design, images will bring your website to life and increase engagement. Beside learning about classes built specifically for images, this is also an opportunity to learn about more Bootstrap 4 utilities: sizing, border radius and shadows.
Day 4: Bootstrap 4 Typography Tutorial and Examples
Welcome to the 4th day of learning Bootstrap 😌 Today we will learn about the Bootstrap 4 typography. It is important to understand and use the typography options well. They will give you the possibility to present the information on your page the best way possible. Typography is one of the most important elements of a design and done properly it will capture the user’s attention, establish information hierarchy and create harmony in the page.
Day 3: Bootstrap 4 Flex Tutorial and Examples
Hey and welcome to the third day of Bootstrap 4 ☺️ Today we will learn about the Bootstrap 4 Flex. Flexbox is a new layout mode in CSS3. It describes ways to align and size elements. Understanding how the Bootstrap 4 flex works will help you align elements horizontally and vertically (to the left, center and right), size them according to their parent and tell them how to fill a row.
Bootstrap 4 has created classes around the CSS3 properties so you can use them with ease. Today we will go through them and create example scenarios. Aligning and sizing elements are crucial parts of front-end development. It is important to get them right before starting with the Bootstrap 4 elements and components. I have personally skipped the flexbox tutorial when I switched to Bootstrap 4. And I found I needed to learn about it very quickly (one the first day I started creating a webpage actually).
Useful Bootstrap 4 Select Picker Options for Your Forms
If you are just starting to learn Bootstrap, we have created a series of tutorials called 14 Days of Bootstrap 4 that can help you.
The Bootstrap 4 Select Picker is one of the components most commonly used inside forms. When having to add a select picker, the first option is the default Bootstrap 4 component. This will not style the dropdown menu where the options appear though. Another popular option is to create your own classes and add them to the <select> tag for restyling.
But one of the easiest solutions is to search for jQuery select pickers or open-source projects created specifically for this purpose. This way you will be sure that if you want to need new functionalities for your select picker, you will not have to write them yourself. In this article we will go through the most popular option and what are the pros and cons to using it. We will also show how to integrate and use the Bootstrap select picker with examples.