HTML and CSS Reference
the future. You can use any hierarchical naming convention other than that
related to casinos and playing cards.
NOTE: This is simply a naming convention that I have adopted to
make it easier for me and other developers to understand the structure
of my applications. This also makes it semantically clear when writing
application. You can use any IDs or classes you wish, or you can
follow suite and use mine. Just make sure that they are meaningful.
You will notice that the CSS doesn't link to mobile.scss . This is because the
SCSS file will need to be compiled and converted to CSS by SASS. Once the
compilation is complete, the mobile.css file will appear. Open the mobile.scss
file and press Shift + CMD + R and then press 1. This will compile the SASS file
into a CSS file. (SASS will be covered in Chapter 5.)
It's time to create the header for the application. The code shown in Listing 4-12
should be added just inside the <div id="shoe"> element but just before the
<div id="deck"> element.
Listing 4-12. Header Code
<h1 class="branding">Mo Memo</h1>
<input type="text" name="query" placeholder="enter your movie
<input type="submit" value="ADD" />
This will simply create a title and form for the user to search, as shown in Figure
4-7. Using CSS, this will be placed at the top of the screen.