Start learning with our library of video tutorials taught by experts. Get started
Viewed by members. in countries. members currently watching.
In Creating an Online Resume: Hands-On Training, interactive design professor and enthusiastic educator Laurie Burruss teaches how to produce an online resume—and create a first web site in the process. Laurie suggests structure and information needed to create a winning resume, and shows how to design the pages with simple typographic principles and effective layouts. She explains how to use Cascading Style Sheets (CSS) and control the design and structure of HTML documents through hands-on development. Exercise files with additional supporting materials accompany the course.
I have one more div box that I need to create, and that's an area for the sidebar. So I'm going to create a div and give it a name of 'sidebar.' Because I'm using a float and I want the sidebar to float to the right, it needs to be before the content div. Your floaters should always be before the thing they're going to float in front of. So that's important to think about. The content area will have the fixed margin, but the sidebar will be the thing that floats up so it needs to appear first in the order in the HTML page.
I want it to appear though after the header. So now that I've thought about what I want to do, I'm going to locate the close tag for the header, hit my Enter key, and now I'm ready to insert a div tag here that will hold the sidebar content. I'll return to my Common Insert bar and choose Insert Div Tag. Notice that, Dreamweaver being smart, because we do defined our site, says "You want to insert a div at your insertion point." This time we did not have a selection, and I know that it's going to be an ID, because it's an area that will only appear once, it's the sidebar.
So I'll type 'sidebar," then click OK. Now you are probably thinking, "How will I see that it's there?" When you create an empty div tag, Dreamweaver automatically adds some dummy text in there as a placeholder. Dreamweaver does this because if there is no content there, this box will collapse, because there's nothing inside of it. For the moment we're just going to leave it with, 'Content for id "sidebar" Goes Here.' But as you can see, it's right there. It's a tiny box with only one line of text inside of it.
You can also see it over here in the Code view. Before I forget, I'm going to go ahead and insert my comment right before the close tag by going over to my toolbar and choosing Apply Comment, Apply HTML. And then type in 'close sidebar.' And then hit the Refresh key. If I put my I-beam inside of the sidebar div, you'll note that it does appear down in my Tag Inspector. Again, I'm going back out to Design view for just a moment. So we have all of our divs established.
We have one big wrapper surrounding all three of these divs, or boxes. We have our header, then we have our sidebar, which is going to float, and then we have our content area. So we are ready to go.
There are currently no FAQs about Creating an Online Resume: Hands-On Training.
Access exercise files from a button right under the course name.
Search within course videos and transcripts, and jump right to the results.
Remove icons showing you already watched videos if you want to start over.
Make the video wide, narrow, full-screen, or pop the player out of the page into its own window.
Click on text in the transcript to jump to that spot in the video. As the video plays, the relevant spot in the transcript will be highlighted.