Python for Entrepreneurs Transcripts
Chapter: Web design: CSS Frontend frameworks and Bootstrap
Lecture: Concept: Bootstrap forms

Login or purchase this course to watch this video and the rest of the course contents.
0:02 As we've seen, beautiful forms are key to user engagement and happiness.
0:07 And, you just want your app to look beautiful and entice people to interact with it.
0:12 So we've seen that those forms on the left can easily be transformed to the forms on the right, using just a couple of CSS statements
0:21 and some Bootstrap CSS classes. Remember, we've added form-control to the inputs and text areas, button to the button,
0:31 and we added a little margin to input some text areas. Let's look at the code. Here you can see we have our inputs,
0:38 we've added the placeholders so we don't have to deal with having a title or a label and the important thing is we've added form-control.
0:45 This makes the input display or layout in what's called block style, that means each input is on its own new line,
0:52 that's why we don't need a "br" or some sort of line break, but it also makes them wide and sort of full screen
0:58 as we talked about to look best on mobile devices and small screens. So we threw this input and text areas style to say let's set the max width to 350
1:06 and we also thought they were a little cramped, so let's put a margin on it. And that's how we got that really nice-looking form
1:13 out of basically raw HTML with Bootstrap.

Talk Python's Mastodon Michael Kennedy's Mastodon