Now, we'll need to create an HTML file and a CSS file and hook the two together.Let's start by going to Dreamweaver, choose File > New > HTML.Let's choose XHTML 1.0 Transitional, so this will work all the way back in XPand as far back as IE 7 for some of the techniques we're going to use.With this brand-new file, let's choose File > Save, make sure we're in themyGallery directory. We'll call this index.html. Click Save.

We now have our CSS file looked into our HTML file.Let's choose File > Save All.Now with our HTML and CSS file in place, in the next movie we're going to referback to our sketch and we're going to start creating some CSS rules that aregoing to help us recreate our layout in HTML.

Resume Transcript Auto-Scroll

Author

Released

4/27/2011

In Create an Interactive Photo Gallery with jQuery and Dreamweaver, author Chris Converse develops an interactive photo gallery for a web site using HTML, CSS, and the open-source JavaScript library jQuery. The course begins with tutorials on extracting different-sized images sets from an original photo collection, designing the site layout, and constructing the HTML and CSS. Then, following the progressive enhancement strategy, Chris utilizes JavaScript plug-ins to include lightboxes and other types of interactivity while maintaining backwards compatibility with older browsers and devices. Exercise files accompany the course.