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:06 And, you just want your app to look beautiful and entice people to interact with it.
0:11 So we've seen that those forms on the left can easily be transformed
0:15 to the forms on the right, using just a couple of CSS statements
0:20 and some Bootstrap CSS classes.
0:23 Remember, we've added form-control to the inputs and text areas,
0:27 button to the button,
0:30 and we added a little margin to input some text areas.
0:33 Let's look at the code. Here you can see we have our inputs,
0:37 we've added the placeholders so we don't have to deal with
0:40 having a title or a label and the important thing is we've added form-control.
0:44 This makes the input display or layout in what's called block style,
0:48 that means each input is on its own new line,
0:51 that's why we don't need a "br" or some sort of line break,
0:54 but it also makes them wide and sort of full screen
0:57 as we talked about to look best on mobile devices and small screens.
1:01 So we threw this input and text areas style to say let's set the max width to 350
1:05 and we also thought they were a little cramped, so let's put a margin on it.
1:09 And that's how we got that really nice-looking form
1:12 out of basically raw HTML with Bootstrap.