Hour 1 Code Samples – Sams Teach Yourself Responsive Web Design in 24 Hours

Listing 1.1

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Single Pixel GIF Trick Demonstrated</title>
</head>
<body>
    <h1>Single Pixel GIF Trick Demonstrated </h1>
    <p>Here is a simple page with two paragraphs (besides this one). The first paragraph uses a single-pixel transparent GIF to indent the first line. The second uses a single-pixel GIF that is not transparent to demonstrate the same technique. </p>
    <p><img src="images/single-pixel-transparent.gif" width="50" height="1" alt=""/>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.</p>
    <p><img src="images/single-pixel.gif" width="50" height="1" alt=""/>Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.</p>
</body>
</html>

9 thoughts on “Hour 1 Code Samples – Sams Teach Yourself Responsive Web Design in 24 Hours

  1. Should be able to download all the html and images instead of cutting and pasting considering the cost of the book. Speaking of images in your examples, where are they?

    1. Most people have told me they prefer to copy and paste the HTML and CSS so they can more easily work with it. I will take your suggestion to make them downloadable under advisement. It’s a good idea, but I want to make sure I can do it effectively without causing other problems on my website.

      As for the images in the examples, those are copyrighted and not available for use. The idea is for you to use your own images and the images I used in the book are there so you can see how the HTML and CSS will look.

      Thanks for your feedback.

      1. I think the code samples is fine. I just bookmark, go to chapter, copy/paste into Dreamweaver, save the page and practice.
        Love the book, highlighted throughout and the TRY IT YOURSELF is extremely helpful.

    2. Cutting and pasting images is stealing dude. It is called copyright infringement and is a Federal law.

Leave a Reply to Patrice Clarkson Cancel reply

Your email address will not be published.