WebDev Level 1 Example Answers

Transcription

1 1 of 26 14/11/2014 9:54 a.m. WebDev Level 1 Example Answers 1.1. <meta name="description" content="code Avengers superhero profile page"> <header> <a href=" src="/images /logo.png"> <a href="/m/about.html">about us <a href=" </header> <section> <img src="/images/profile1.png" width="180" alt="profile"> <a href=" target="_blank" title="my Car"> <img src="/images/car.jpg" width="100"> <strong>name</strong>: Supacoda <strong>birthday</strong>: 14^th April <strong>height</strong>: 1.79m <h2>my Super Powers</h2> <p>i have super endurance, once I start, I keep going until I finish! <p>i will eat anything and lots of it... if there is a plate with food on it, I will eat it! <h2>my Favorite Websites</h2> <li><a href=" HTML5 game <li><a href=" language learning site <li><a href=" cricket scoring software <li><a href=" blog <li><a href=" photography <h2>my Top 5 Foods</h2> <li>banana and feijoa smoothy <li>chicken nacho salad <li>vegetarian lasagna <li>fresh fruit and yogurt with LSA <li>weetbix with muesli </section> <footer>created by Mike 2012</footer> 1.2. Make your superhero profile in lesson Make a business profile in lessons Make your superhero profile in lesson Make a business profile in lessons Make your superhero profile in lesson <p> Make a business profile in lessons Make your superhero profile in lesson <p> Make a business profile in lessons My Profile 2.2. <h2>my Profile</h2> 2.3. Name: Super Cutey Birthday: 24^th December 2.4. <strong>name</strong>: Super Cutey <strong>birthday</strong>: 24^th December <strong>height</strong>: 0.63m 2.5. <strong>name</strong>: Super Cutey <strong>birthday</strong>: 24^th December <strong>height</strong>: 0.63m 3.1. <title>code Avengers, Common Mistakes</title> <h1>common Bugs</h1> Wrong end tags <strong>this text is bold</strong> This text should NOT be bold 3.2. <title>code Avengers, Common Mistakes</title>

2 2 of 26 14/11/2014 9:54 a.m. <h1>common Bugs</h1> Wrong end tags Missing slashes 3.3. <title>code Avengers, Common Mistakes</title> <h1>common Bugs</h1> Wrong end tags Missing slashes Wrong tags 3.4. <title>code Avengers, Common Mistakes</title> <h1>common Bugs</h1> Wrong end tags Missing slashes Wrong tags Wrong slash 3.5. <title>code Avengers, Common Mistakes</title> <h1>common Bugs</h1> Wrong end tags Missing slashes Wrong tags Wrong slash Deleted characters 4.1. <img <strong>name</strong>: Super Cutey <strong>birthday</strong>: 24^th December <strong>height</strong>: 0.63m 4.2. <strong>name</strong>: Super Cutey <strong>birthday</strong>: 24^th December <strong>height</strong>: 0.63m <img width="120" src="/images/daughter2.jpg"> <img width="120" src="/images/daughter3.jpg"> <img width="120" src="/images/daughter4.jpg"> <img width="120" src="/images/daughter5.jpg"> 4.3. <strong>name</strong>: Super Cutey <strong>birthday</strong>: 24^th December <strong>height</strong>: 0.63m <img width="120" src="/images/daughter2.jpg" title="kiss for Daddy"> <img width="120" src="/images/daughter3.jpg" title="my Mummy"> <img width="120" src="/images/daughter4.jpg" title="look at my muscles"> <img width="120" src="/images/daughter5.jpg" title="mmm... lunch time"> 4.4. <img title="2 weeks old" width="180" src="/images /profile0.png"> <img title="i love Aunty" height="100" src=" /AAAAAAAAASM/Qz1k_J3fTXQ/s320/IMG_7893.JPG"> My Aunty <strong>name</strong>: Super Cutey <strong>birthday</strong>: 24^th December <strong>height</strong>: 0.63m 4.5. <strong>name</strong>: Super Cutey <strong>birthday</strong>: 24^th December <strong>height</strong>: 0.63m <img alt="me" title="2 weeks old" width="100" <img alt="my Aunty" title="i love Aunty" height="100" src=" /AAAAAAAAASM/Qz1k_J3fTXQ/s320/IMG_7893.JPG"> My Aunty 5.1. <a href=" <img alt="my Aunty" title="i love Aunty" height="100" src=" /AAAAAAAAASM/Qz1k_J3fTXQ/s320/IMG_7893.JPG"> <a href=" Aunty <strong>name</strong>: Super Cutey <strong>birthday</strong>: 24^th December <strong>height</strong>: 0.63m

3 3 of 26 14/11/2014 9:54 a.m <a href="/m/about.html">about us <a href=" <img alt="my Aunty" title="i love Aunty" height="100" src=" /AAAAAAAAASM/Qz1k_J3fTXQ/s320/IMG_7893.JPG"> <a href=" Aunty <strong>name</strong>: Super Cutey <strong>birthday</strong>: 24^th December <strong>height</strong>: 0.63m 5.3. <a href="/index.html"><img alt="code Avengers logo" src="/images/logo.png"> <a href="/m/about.html">about us <a href=" <img alt="my Aunty" title="i love Aunty" height="100" src=" /AAAAAAAAASM/Qz1k_J3fTXQ/s320/IMG_7893.JPG"> <a href=" Aunty <strong>name</strong>: Super Cutey <strong>birthday</strong>: 24^th December <strong>height</strong>: 0.63m 5.4. <a href="/index.html"><img alt="code Avengers logo" src="/images/logo.png"> <a href="/m/about.html">about us <a href=" <a href=" target="_blank"> <img alt="my Aunty" title="i love Aunty" height="100" src=" /Ty7glhjxj4I/AAAAAAAAASM/Qz1k_J3fTXQ /s320/img_7893.jpg"> My Aunty <strong>name</strong>: Super Cutey <strong>birthday</strong>: 24^th December <strong>height</strong>: 0.63m 5.5. <a href="/index.html"><img alt="code Avengers logo" title="go to Code Avengers home page" src="/images /logo.png"> <a href="/m/about.html">about us <a href=" <a href=" target="_blank"> <img alt="my Aunty" title="i love Aunty" height="100" src=" /Ty7glhjxj4I/AAAAAAAAASM/Qz1k_J3fTXQ /s320/img_7893.jpg"> My Aunty <strong>name</strong>: Super Cutey <strong>birthday</strong>: 24^th December <strong>height</strong>: 0.63m 6.1. <title>code Avengers, Common Mistakes</title> <a href="/index.html"><img src="/images/logo.png"> <a href="/m/about.html">about us <a href=" <h1>common Mistakes</h1> Spelling mistakes in tag names 6.2. <title>code Avengers, Common Mistakes</title> <a href="/index.html"><img src="/images/logo.png"> <a href="/m/about.html">about us <a href=" <h1>common Mistakes</h1> Spelling mistakes in tag names Missing end tags 6.3. <title>code Avengers, Common Mistakes</title> <a href="/index.html"><img src="/images/logo.png"> <a href="/m/about.html">about us <a href=" <h1>common Mistakes</h1> Spelling mistakes in tag names Missing end tags Spelling mistakes in attribute values 6.4. <title>code Avengers, Common Mistakes</title> <a href="/index.html"><img src="/images/logo.png"> <a href="/m/about.html">about us <a href=" <h1>common Mistakes</h1> Spelling mistakes in tag names Missing end tags Spelling mistakes in attribute values Incorrect attribute names

4 4 of 26 14/11/2014 9:54 a.m <title>code Avengers, Common Mistakes</title> <a href="/index.html"><img src="/images/logo.png"> <a href="/m/about.html">about us <a href=" <h1>common Mistakes</h1> Spelling mistakes in tag names Missing end tags Spelling mistakes in attribute values Incorrect attribute names Text in the wrong place 7.1. <title>code Avengers, Creator</title> <h1>code Avengers</h1> <h2>about the Creator</h2> 7.2. <title>code Avengers, Creator</title> <h1>code Avengers</h1> <h2>about the Creator</h2> <strong>name</strong>: Mike Walmsley <strong>birthday</strong>: 14^th April <strong>job</strong>: PhD student 7.3. <title>code Avengers, Creator</title> <h1>code Avengers</h1> <h2>about the Creator</h2> <strong>name</strong>: Mike Walmsley <strong>birthday</strong>: 14^th April <strong>job</strong>: PhD student <img src="/images/wedding.jpg" height="140" title="married 2010/03/06" alt="mike and Nellie's wedding"> 7.4. <title>code Avengers, Creator</title> <a href="/index.html" title="go to home page"><h1>code Avengers</h1> <h2>about the Creator</h2> <strong>name</strong>: Mike Walmsley <strong>birthday</strong>: 14^th April <strong>job</strong>: PhD student <a /mrwwalmsley" target="_blank"><img src="/images/wedding.jpg" height="140" title="married 2010/03/06" alt="mike and Nellie's wedding"> 7.5. <title>code Avengers, My Likes</title> <h1>my Likes</h1> <h2>my family</h2> <a href=" <img src=" /daughter3.jpg" height="140"> <h2>sports</h2> <a href=" <img height="140" alt="me playing AFL" src=" <a href=" <img height="140" alt="me finishing a marathon" src=" > <h2>singing</h2> <iframe src=" width="320"></iframe> My sisters, Jenna and Holly 8.1. <a href="/index.html"><img alt="code Avengers logo" title="go to Code Avengers home page" src="/images /logo.png"> <a href="/m/about.html">about us <a href=" <a href=" target="_blank"> <img alt="my Aunty" title="i love Aunty" height="100" src=" /Ty7glhjxj4I/AAAAAAAAASM/Qz1k_J3fTXQ /s320/img_7893.jpg"> My Aunty <strong>name</strong>: Super Cutey <strong>birthday</strong>: 24^th December <strong>height</strong>: 0.63m <hr> <h2>my Super Powers</h2> I make people grab my cheeks by smiling... And pick me up by crying. I roll across my room in less than a minute <a href="/index.html"><img alt="code Avengers logo" title="go to Code Avengers home page" src="/images /logo.png"> <a href="/m/about.html">about us <a href=" <a href=" target="_blank"> <img alt="my Aunty" title="i love Aunty" height="100" src=" /Ty7glhjxj4I/AAAAAAAAASM/Qz1k_J3fTXQ /s320/img_7893.jpg"> My Aunty

5 5 of 26 14/11/2014 9:54 a.m. <strong>name</strong>: Super Cutey <strong>birthday</strong>: 24^th December <strong>height</strong>: 0.63m <hr> <h2>my Super Powers</h2> <p>i make people grab my cheeks by smiling... <p>and pick me up by crying. <p>i roll across my room in less than a minute <a href="/index.html"><img alt="code Avengers logo" title="go to Code Avengers home page" src="/images /logo.png"> <a href="/m/about.html">about us <a href=" <a href=" target="_blank"> <img alt="my Aunty" title="i love Aunty" height="100" src=" /Ty7glhjxj4I/AAAAAAAAASM/Qz1k_J3fTXQ /s320/img_7893.jpg"> My Aunty <strong>name</strong>: Super Cutey <strong>birthday</strong>: 24^th December <strong>height</strong>: 0.63m <hr> <h2>my Super Powers</h2> <p>i make people grab my cheeks by smiling... <p>and pick me up by crying. <p>i roll across my room in less than a minute. <h2>my Top Websites</h2> <li><a href=" blog <li><a href=" //focusstudio.co.nz">grandma's photography <li><a href=" game <li><a href=" language learning site <li><a href=" cricket scoring software 8.4. <a href="/index.html"><img alt="code Avengers logo" title="go to Code Avengers home page" src="/images /logo.png"> <a href="/m/about.html">about us <a href=" <a href=" target="_blank"> <img alt="my Aunty" title="i love Aunty" height="100" src=" /Ty7glhjxj4I/AAAAAAAAASM/Qz1k_J3fTXQ /s320/img_7893.jpg"> My Aunty <strong>name</strong>: Super Cutey <strong>birthday</strong>: 24^th December <strong>height</strong>: 0.63m <hr> <h2>my Super Powers</h2> <p>i make people grab my cheeks by smiling... <p>and pick me up by crying. <p>i roll across my room in less than a minute. <h2>my Top Websites</h2> <li><a href=" blog <li><a href=" //focusstudio.co.nz">grandma's photography <li><a href=" game <li><a href=" language learning site <li><a href=" cricket scoring software <h2>my Top 5 Foods</h2> <li>mum's milk <li>mashed apple and peach <li>mashed carrots <li>mashed banana <li>farrex 8.5. <meta name="description" content="code Avengers superhero profile page"> <a href="/index.html"><img alt="code Avengers logo" title="go to Code Avengers home page" src="/images /logo.png"> <a href="/m/about.html">about us <a href=" <a href=" target="_blank"> <img alt="my Aunty" title="i love Aunty" height="100" src=" /Ty7glhjxj4I/AAAAAAAAASM/Qz1k_J3fTXQ /s320/img_7893.jpg"> My Aunty <strong>name</strong>: Super Cutey <strong>birthday</strong>: 24^th December <strong>height</strong>: 0.63m <hr> <h2>my Super Powers</h2> <p>i make people grab my cheeks by smiling... <p>and pick me up by crying. <p>i roll across my room in less than a minute. <h2>my Top Websites</h2> <li><a href=" blog <li><a href=" //focusstudio.co.nz">grandma's photography <li><a href=" game

6 6 of 26 14/11/2014 9:54 a.m. <li><a href=" language learning site <li><a href=" cricket scoring software <h2>my Top 5 Foods</h2> <li>mum's milk <li>mashed apple and peach <li>mashed carrots <li>mashed banana <li>farrex 9.1. <title>code Avengers, HTML differences</title> <link rel="stylesheet" href="/css/article.css"> <h1>differences</h1> <h2>capitalization</h2> <p>doctype is usually in uppercase <p>all other tag and attribute names should be lowercase 9.2. <title>code Avengers, HTML differences</title> <link rel="stylesheet" href="/css/article.css"> <h1>differences</h1> <h2>attribute Values</h2> <p>attribute values should be surrounded by double quotes <p>attribute values <p>all other tag and attribute names should be lowercase 9.3. <title>code Avengers, HTML differences</title> <link rel="stylesheet" href="/css/article.css"> <h1>differences</h1> <h2>html, head, body</h2> <p>the html tag marks the start and end of an html page. <p>the head and body tags mark the start and end of those sections. <p>these 3 tags are optional, so we don't use them <title>code Avengers, HTML differences</title> <link rel="stylesheet" href="/css/article.css"> <h1>differences</h1> <h2>optional tags</h2> <p>some elements only have a start tag <p>some elements have an optional end tag <h3>start tag only</h3> <li>img <li>meta <li>link <li>br <h3>optional end tag</h3> <li>p <li>li 9.5. <!-- This is the head section, these are NOT shown on the page --> <title>code Avengers, HTML differences</title> <link rel="stylesheet" href="/css/article.css"> <!-- This is the body section, this IS shown on the page --> <h1>differences</h1> <h2>comments</h2> <p>comments are used to: <li>explain the purpose of your code to your team; <li>hide code that you might want to show again later <meta name="description" content="code Avengers superhero profile page"> <header> <a href="/index.html"><img alt="code Avengers logo" title="go to Code Avengers home page" src="/images /logo.png"> <a href="/m/about.html">about us <a href=" </header> <a href=" target="_blank"> <img alt="my Aunty" title="i love Aunty" height="100" src=" /Ty7glhjxj4I/AAAAAAAAASM/Qz1k_J3fTXQ /s320/img_7893.jpg"> My Aunty <strong>name</strong>: Super Cutey <strong>birthday</strong>: 24^th December <strong>height</strong>: 0.63m <hr> <h2>my Super Powers</h2> <p>i make people grab my cheeks by smiling... <p>and pick me up by crying. <p>i roll across my room in less than a minute. <h2>my Top Websites</h2> <li><a href=" blog <li><a href=" //focusstudio.co.nz">grandma's photography <li><a href=" game <li><a href=" language learning site <li><a href=" cricket scoring software <h2>my Top 5 Foods</h2> <li>mum's milk <li>mashed apple and peach

7 7 of 26 14/11/2014 9:54 a.m. <li>mashed carrots <li>mashed banana <li>farrex <footer>created by Mike 2012</footer> <meta name="description" content="code Avengers superhero profile page"> <header> <a href="/index.html"><img alt="code Avengers logo" title="go to Code Avengers home page" src="/images /logo.png"> <a href="/m/about.html">about us <a href=" </header> <section> <a href=" target="_blank"> <img alt="my Aunty" title="i love Aunty" height="100" src=" /Ty7glhjxj4I/AAAAAAAAASM/Qz1k_J3fTXQ /s320/img_7893.jpg"> My Aunty <strong>name</strong>: Super Cutey <strong>birthday</strong>: 24^th December <strong>height</strong>: 0.63m <hr> <h2>my Super Powers</h2> <p>i make people grab my cheeks by smiling... <p>and pick me up by crying. <p>i roll across my room in less than a minute. <h2>my Top Websites</h2> <li><a href=" blog <li><a href=" //focusstudio.co.nz">grandma's photography <li><a href=" game <li><a href=" language learning site <li><a href=" cricket scoring software <h2>my Top 5 Foods</h2> <li>mum's milk <li>mashed apple and peach <li>mashed carrots <li>mashed banana <li>farrex </section> <footer>created by Mike 2012</footer> <meta name="description" content="code Avengers superhero profile page"> <link rel="stylesheet" href=" /css/profile1.css"> <header> <a href=" <img alt="code Avengers logo" title="go to Code Avengers home page" src=" /logo.png"> <a href="/m/about.html">about us <a href=" </header> <section> <a href=" target="_blank"> <img alt="my Aunty" title="i love Aunty" height="100" src=" /Ty7glhjxj4I/AAAAAAAAASM/Qz1k_J3fTXQ /s320/img_7893.jpg"> My Aunty <strong>name</strong>: Super Cutey <strong>birthday</strong>: 24^th December <strong>height</strong>: 0.63m <hr> <h2>my Super Powers</h2> <p>i make people grab my cheeks by smiling... <p>and pick me up by crying. <p>i roll across my room in less than a minute. <h2>my Top Websites</h2> <li><a href=" blog <li><a href=" //focusstudio.co.nz">grandma's photography <li><a href=" game <li><a href=" language learning site <li><a href=" cricket scoring software <h2>my Top 5 Foods</h2> <li>mum's milk <li>mashed apple and peach <li>mashed carrots <li>mashed banana <li>farrex </section> <footer>created by Mike 2012</footer> <meta name="description" content="code Avengers superhero profile page"> <link rel="stylesheet" href=" /css/profile1.css"> <header> <a href=" <img alt="code Avengers logo" title="go to Code Avengers home page" src=" /logo.png"> <a href="/m/about.html">about us <a

8 8 of 26 14/11/2014 9:54 a.m. href=" </header> <section> <a href=" target="_blank"> <img alt="my Aunty" title="i love Aunty" height="100" src=" /Ty7glhjxj4I/AAAAAAAAASM/Qz1k_J3fTXQ /s320/img_7893.jpg"> My Aunty <strong>name</strong>: Super Cutey <strong>birthday</strong>: 24^th December <strong>height</strong>: 0.63m <a href="likes.html">my likes <hr> <h2>my Super Powers</h2> <p>i make people grab my cheeks by smiling... <p>and pick me up by crying. <p>i roll across my room in less than a minute. <h2>my Top Websites</h2> <li><a href=" blog <li><a href=" //focusstudio.co.nz">grandma's photography <li><a href=" game <li><a href=" language learning site <li><a href=" cricket scoring software <h2>my Top 5 Foods</h2> <li>mum's milk <li>mashed apple and peach <li>mashed carrots <li>mashed banana <li>farrex </section> <footer>created by Mike 2012</footer> <meta name="description" content="code Avengers superhero profile page"> <link rel="stylesheet" href="../../css/profile1.css"> <header> <a href="../../index.html"> <img alt="code Avengers logo" title="go to Code Avengers home page" src="../../images/logo.png"> <a href="/m/about.html">about us <a href=" </header> <section> <a href=" target="_blank"> <img alt="my Aunty" title="i love Aunty" height="100" src=" /Ty7glhjxj4I/AAAAAAAAASM/Qz1k_J3fTXQ /s320/img_7893.jpg"> My Aunty <strong>name</strong>: Super Cutey <strong>birthday</strong>: 24^th December <strong>height</strong>: 0.63m <a href="likes.html">my likes <hr> <h2>my Super Powers</h2> <p>i make people grab my cheeks by smiling... <p>and pick me up by crying. <p>i roll across my room in less than a minute. <h2>my Top Websites</h2> <li><a href=" blog <li><a href=" //focusstudio.co.nz">grandma's photography <li><a href=" game <li><a href=" language learning site <li><a href=" cricket scoring software <h2>my Top 5 Foods</h2> <li>mum's milk <li>mashed apple and peach <li>mashed carrots <li>mashed banana <li>farrex </section> <footer>created by Mike 2012</footer> <html> <head> <title>code Avengers, CSS</title> </head> <body> <h2>introduction to CSS</h2> <p>in lessons you will learn the CSS basics <p>you will learn how to: <li>change colors <li>change fonts <li>change sizes <li>add borders <li>use images for bullet points <li>create fixed headers and footers </body> </html> <html> <head> <title>code Avengers, CSS</title> background-color: blue; color: yellow; </head> <body> <h2>introduction to CSS</h2> <p>in lessons you will learn the CSS basics <p>you will learn how to:

9 9 of 26 14/11/2014 9:54 a.m. <li>change colors <li>change fonts <li>change sizes <li>add borders <li>use images for bullet points <li>create fixed headers and footers </body> </html> <html> <head> <title>code Avengers, CSS</title> h2 { background-color: darkblue; color: lightyellow; </head> <body> <h2>introduction to CSS</h2> <p>in lessons you will learn the CSS basics <p>you will learn how to: <li>change colors <li>change fonts <li>change sizes <li>add borders <li>use images for bullet points <li>create fixed headers and footers </body> </html> <html> <head> <title>code Avengers, CSS</title> h2, background-color: indigo; color: yellowgreen; </head> <body> <h2>introduction to CSS</h2> <p>in lessons you will learn the CSS basics <p>you will learn how to: <li>change colors <li>change fonts <li>change sizes <li>add borders <li>use images for bullet points <li>create fixed headers and footers </body> </html> <html> <head> <title>code Avengers, CSS</title> background-color: lightblue; color: navy; h2, ol { background-color: hotpink; </head> <body> <h2>introduction to CSS</h2> <p>in lessons you will learn the CSS basics <p>you will learn how to: <li>change colors <li>change fonts <li>change sizes <li>add borders <li>use images for bullet points <li>create fixed headers and footers </body> </html> <html> <head> <title>code Avengers, Common Bugs</title> background-color: black; color: lightgreen; background-color: lightgreen; color: black; </head> <body> <h1>common CSS Bugs</h1> <p>here is a list of common CSS mistakes: <li>mispelled or incorrect tag names <li>mispelled or incorrect property names <li>mispelled or incorrect property values <li>missing colon (:) after property name <li>missing semi-colon (;) after property values <li>missing comma between tag names (,) <li>missing { around properties </body> </html> <html> <head> <title>code Avengers, Common Bugs</title> background-color: black; color: tan; ul { background-color: wheat; color: black; </head> <body> <h1>common CSS Bugs</h1> <p>here is a list of common CSS mistakes: <li>mispelled or incorrect tag names <li>mispelled or incorrect property names <li>mispelled or incorrect property values <li>missing colon (:) after property name <li>missing semi-colon (;) after property values <li>missing comma between tag names (,) <li>missing { around properties </body> </html> 12.3.

10 10 of 26 14/11/2014 9:54 a.m. <html> <head> <title>code Avengers, Common Bugs</title> background-color: black; color: orange; background-color: gold; color: indigo; ul { background-color: indigo; color: gold; </head> <body> <h1>common CSS Bugs</h1> <p>here is a list of common CSS mistakes: <li>mispelled or incorrect tag names <li>mispelled or incorrect property names <li>mispelled or incorrect property values <li>missing colon (:) after property name <li>missing semi-colon (;) after property values <li>missing comma between tag names (,) <li>missing { around properties </body> </html> <html> <head> <title>code Avengers, Common Bugs</title> body { background-color: black; color: white; background-color: firebrick; ul { background-color: white; </head> <body> <h1>common CSS Bugs</h1> <p>here is a list of common CSS mistakes: <li>mispelled or incorrect tag names <li>mispelled or incorrect property names <li>mispelled or incorrect property values <li>missing colon (:) after property name <li>missing semi-colon (;) after property values <li>missing comma between tag names (,) <li>missing { around properties </body> </html> <title>code Avengers, Common Bugs</title> body { background-color: palegreen; ul, background-color: lightyellow; color: red; <h1>common CSS Bugs</h1> <p>here is a list of common CSS mistakes: <li>mispelled or incorrect tag names <li>mispelled or incorrect property names <li>mispelled or incorrect property values <li>missing colon (:) after property name <li>missing semi-colon (;) after property values <li>missing comma between tag names (,) <li>missing { around properties font-family: cursive; font-family: monospace; font-family: 'Trebuchet MS', sans-serif;

11 11 of 26 14/11/2014 9:54 a.m. font-family: Georgia, serif; font-family: 'Trebuchet MS', sans-serif; font-size: 40px; font-family: Georgia, serif; font-size: 14px; font-family: 'Oregano', cursive; font-size: 40px; font-family: Georgia, serif; font-size: 14px; font-family: 'Oregano', cursive; font-size: 40px; font-family: Georgia, serif; font-size: 14px; <strong>location:</strong> Hamilton, New Zealand <strong> </strong> <strong>phone:</strong> font-family: 'Trebuchet MS', sans-serif; font-family: 'Oregano', cursive; font-size: 40px; font-family: Georgia, serif; font-size: 14px; <strong>location:</strong> Hamilton, New Zealand <strong> </strong> <strong>phone:</strong> font-family: 'Trebuchet MS', sans-serif;

12 12 of 26 14/11/2014 9:54 a.m. font-family: 'Oregano', cursive; font-size: 40px; font-family: Georgia, serif; font-size: 14px; <strong>location:</strong> Hamilton, New Zealand <strong> </strong> <strong>phone:</strong> font-family: 'Trebuchet MS', sans-serif; font-family: 'Oregano', cursive; font-size: 40px; font-family: Georgia, serif; font-size: 14px; h1:hover { font-size: 50px; <strong>location:</strong> Hamilton, New Zealand <strong> </strong> info@focusstudio.co.nz <strong>phone:</strong> font-family: 'Trebuchet MS', sans-serif; font-family: 'Oregano', cursive; font-size: 40px; font-family: Georgia, serif; font-size: 14px; <strong>location:</strong> Hamilton, New Zealand <strong> </strong> info@focusstudio.co.nz <strong>phone:</strong> <title>code Avengers, Style Guide</title> background-color: lightyellow; li { font-family: 'Trebuchet MS', sans-serif; color: blue; <h1>google Style Guide</h1> <p>the Google style guide helps you write code that is easy to read. <h2>css Formatting Guide</h2> <li>put 1 space before the <strong>{</strong>

13 13 of 26 14/11/2014 9:54 a.m. <li>put 2 spaces before property names <li>put 1 space before property values <li>put a <strong>;</strong> after property values <li>a blank line separates each CSS rule <title>code Avengers, Style Guide</title> background-color: lightcyan; font-family: 'Times New Roman', serif; font-size: 18px; h2 { font-family: 'Andale Mono', sans-serif; color: teal; <h1>google Style Guide</h1> <p>the Google style guide helps you write code that is easy to read. <h2>css Formatting Guide</h2> <li>put 1 space before the <strong>{</strong> <li>put 2 spaces before property names <li>put 1 space before property values <li>put a <strong>;</strong> after property values <li>put each property on a new line <li>put each selector on a new line <li>use single quotes around property values when necessary <li>a blank line separates each CSS rule <title>code Avengers, Style Guide</title> background-color: dimgray; color: white; font-family: 'Trebuchet MS', sans-serif; font-size: 17px; h2 { color: chocolate; font-family: 'Comic Sans MS', cursive; <h1>google Style Guide</h1> <p>the Google style guide helps you write code that is easy to read. <h2>css Formatting Guide</h2> <li>put 1 space before the <strong>{</strong> <li>put 2 spaces before property names <li>put 1 space before property values <li>put a <strong>;</strong> after property values <li>put each property on a new line <li>put each selector on a new line <li>use single quotes around property values when necessary <li>a blank line separates each CSS rule <li>put properties in alphabetical order <title>code Avengers, Style Guide</title> color: darkblue; font-size: 16px; font-family: 'Courier New', monospace; font-weight: bold; font-family: Impact, fantasy; font-size: 28px; font-weight: normal; h2 { font-family: 'Century Gothic', sans-serif; font-size: 20px; <h1>google Style Guide</h1> <p>the Google style guide helps you write code that is easy to read. <h2>css Formatting Guide</h2> <li>put 1 space before the <strong>{</strong> <li>put 2 spaces before property names <li>put 1 space before property values <li>put a <strong>;</strong> after property values <li>put each property on a new line <li>put each selector on a new line <li>use single quotes around property values when necessary <li>a blank line separates each CSS rule <li>put properties in alphabetical order <title>code Avengers, Style Guide</title> color: darkblue; font: bold 16px 'Courier New', monospace; font: normal 28px Impact, fantasy; h2 { font: bold 20px 'Century Gothic', sans-serif; <h1>google Style Guide</h1> <p>the Google style guide helps you write code that is easy to read. <h2>css Formatting Guide</h2> <li>put 1 space before the <strong>{</strong> <li>put 2 spaces before property names <li>put 1 space before property values <li>put a <strong>;</strong> after property values <li>put each property on a new line <li>put each selector on a new line <li>use single quotes around property values when necessary <li>a blank line separates each CSS rule <li>put properties in alphabetical order <h2>css Style Guide</h2> <p>use shorthand properties where possible 16.1.

14 14 of 26 14/11/2014 9:54 a.m. font-family: 'Trebuchet MS', sans-serif; font-family: 'Oregano', cursive; font-size: 40px; font-family: Georgia, serif; font-size: 14px; <strong>location:</strong> Hamilton, New Zealand <strong> </strong> <strong>phone:</strong> <img src="/images/daughter7.jpg" alt="my daughter" width="115"> <img src="/images/daughter8.jpg" alt="my daughter 2" width="115"> font-family: 'Trebuchet MS', sans-serif; font-family: 'Oregano', cursive; font-size: 40px; font-family: Georgia, serif; font-size: 14px; height: 170px; <strong>location:</strong> Hamilton, New Zealand <strong> </strong> <strong>phone:</strong> font-family: 'Trebuchet MS', sans-serif; font-family: 'Oregano', cursive; font-size: 40px; font-family: Georgia, serif; font-size: 14px; border-style: ridge; border-width: 20px; height: 170px; <strong>location:</strong> Hamilton, New Zealand <strong> </strong>

15 15 of 26 14/11/2014 9:54 a.m. <strong>phone:</strong> font-family: 'Trebuchet MS', sans-serif; font-family: 'Oregano', cursive; font-size: 40px; font-family: Georgia, serif; font-size: 14px; border-color: gold; border-width: 20px; height: 170px; <strong>location:</strong> Hamilton, New Zealand <strong> </strong> <strong>phone:</strong> <strong>location:</strong> Hamilton, New Zealand <strong> </strong> <strong>phone:</strong> margin-bottom: 0; margin-top: 2px;

16 16 of 26 14/11/2014 9:54 a.m. margin-top: 0; <strong>location:</strong> Hamilton, New Zealand <strong> </strong> <strong>phone:</strong> margin-bottom: 0; margin-top: 2px; margin-top: 0; margin-right: 20px; margin-top: 15px; <strong>location:</strong> Hamilton, New Zealand <strong> </strong> <strong>phone:</strong> margin-bottom: 0; margin-top: 2px; margin-top: 0; margin-right: 20px; margin-top: 15px; margin-top: 14px; margin-bottom: 10px; <strong>location:</strong> Hamilton, New Zealand <strong> </strong> <strong>phone:</strong>

17 17 of 26 14/11/2014 9:54 a.m. <p>come and enjoy the comfortable surroundings of our home studio away from the city 'rush' and know that there is a parking space with your name on it. <p>when you arrive, you will find our waiting room to be very comfortable. There are a selection of <p>next door in our camera room is where we will work our magic and give you the individualized attention that is required to give you portraits that are both creative and truly unique <strong>location:</strong> Hamilton, New Zealand <strong> </strong> info@focusstudio.co.nz <strong>phone:</strong> <p>come and enjoy the comfortable surroundings of our home studio away from the city 'rush' and know that there is a parking space with your name on it. <p>when you arrive, you will find our waiting room to be very comfortable. There are a selection of <p>next door in our camera room is where we will work our magic and give you the individualized attention that is required to give you portraits that are both creative and truly unique <strong>location:</strong> Hamilton, New Zealand <strong> </strong> info@focusstudio.co.nz <strong>phone:</strong>

18 18 of 26 14/11/2014 9:54 a.m. <p>come and enjoy the comfortable surroundings of our home studio away from the city 'rush' and know that there is a parking space with your name on it. <p>when you arrive, you will find our waiting room to be very comfortable. There are a selection of <p>next door in our camera room is where we will work our magic and give you the individualized attention that is required to give you portraits that are both creative and truly unique box-shadow: 4px 4px; <strong>location:</strong> Hamilton, New Zealand <strong> </strong> info@focusstudio.co.nz <strong>phone:</strong> <p>come and enjoy the comfortable surroundings of our home studio away from the city 'rush' and know that there is a parking space with your name on it. <p>when you arrive, you will find our waiting room to be very comfortable. There are a selection of <p>next door in our camera room is where we will work our magic and give you the individualized attention that is required to give you portraits that are both creative and truly unique box-shadow: 4px 4px violet; <strong>location:</strong> Hamilton, New Zealand <strong> </strong> info@focusstudio.co.nz <strong>phone:</strong>

19 19 of 26 14/11/2014 9:54 a.m. <p>come and enjoy the comfortable surroundings of our home studio away from the city 'rush' and know that there is a parking space with your name on it. <p>when you arrive, you will find our waiting room to be very comfortable. There are a selection of <p>next door in our camera room is where we will work our magic and give you the individualized attention that is required to give you portraits that are both creative and truly unique box-shadow: 1px 1px 8px 4px violet; <strong>location:</strong> Hamilton, New Zealand <strong> </strong> info@focusstudio.co.nz <strong>phone:</strong> <p>come and enjoy the comfortable surroundings of our home studio away from the city 'rush' and know that there is a parking space with your name on it. <p>when you arrive, you will find our waiting room to be very comfortable. There are a selection of <p>next door in our camera room is where we will work our magic and give you the individualized attention that is required to give you portraits that are both creative and truly unique text-shadow: 2px 2px 3px slateblue; box-shadow: 1px 1px 8px 4px violet; <strong>location:</strong> Hamilton, New Zealand <strong> </strong> info@focusstudio.co.nz <strong>phone:</strong>

20 20 of 26 14/11/2014 9:54 a.m. <p>come and enjoy the comfortable surroundings of our home studio away from the city 'rush' and know that there is a parking space with your name on it. <p>when you arrive, you will find our waiting room to be very comfortable. There are a selection of <p>next door in our camera room is where we will work our magic and give you the individualized attention that is required to give you portraits that are both creative and truly unique text-shadow: 1px 1px 0 darkslateblue, 2px 2px 3px slateblue; box-shadow: 1px 1px 8px 4px violet; <strong>location:</strong> Hamilton, New Zealand <strong> </strong> info@focusstudio.co.nz <strong>phone:</strong> <p>come and enjoy the comfortable surroundings of our home studio away from the city 'rush' and know that there is a parking space with your name on it. <p>when you arrive, you will find our waiting room to be very comfortable. There are a selection of <p>next door in our camera room is where we will work our magic and give you the individualized attention that is required to give you portraits that are both creative and truly unique background-image: url(/images/textures/light2.png); text-shadow: 1px 1px 0 darkslateblue, 2px 2px 3px slateblue; box-shadow: 1px 1px 8px 4px violet; <strong>location:</strong> Hamilton, New Zealand <strong> </strong> info@focusstudio.co.nz

21 21 of 26 14/11/2014 9:54 a.m. <strong>phone:</strong> <p>come and enjoy the comfortable surroundings of our home studio away from the city 'rush' and know that there is a parking space with your name on it. <p>when you arrive, you will find our waiting room to be very comfortable. There are a selection of <p>next door in our camera room is where we will work our magic and give you the individualized attention that is required to give you portraits that are both creative and truly unique background-image: url(/images/textures/light2a.png); text-shadow: 1px 1px 0 darkslateblue, 2px 2px 3px slateblue; box-shadow: 1px 1px 8px 4px violet; <strong>location:</strong> Hamilton, New Zealand <strong> </strong> info@focusstudio.co.nz <strong>phone:</strong> <p>come and enjoy the comfortable surroundings of our home studio away from the city 'rush' and know that there is a parking space with your name on it. <p>when you arrive, you will find our waiting room to be very comfortable. There are a selection of <p>next door in our camera room is where we will work our magic and give you the individualized attention that is required to give you portraits that are both creative and truly unique background: hotpink url(/images/textures /light2a.png); text-shadow: 1px 1px 0 darkslateblue, 2px 2px 3px slateblue; box-shadow: 1px 1px 8px 4px violet;

22 22 of 26 14/11/2014 9:54 a.m. <strong>location:</strong> Hamilton, New Zealand <strong> </strong> <strong>phone:</strong> <p>come and enjoy the comfortable surroundings of our home studio away from the city 'rush' and know that there is a parking space with your name on it. <p>when you arrive, you will find our waiting room to be very comfortable. There are a selection of <p>next door in our camera room is where we will work our magic and give you the individualized attention that is required to give you portraits that are both creative and truly unique background: hotpink url(/images/textures /light2a.png); text-shadow: 1px 1px 0 darkslateblue, 2px 2px 3px slateblue; box-shadow: 1px 1px 8px 4px violet; ul { list-style-type: circle; <strong>location:</strong> Hamilton, New Zealand <strong> </strong> info@focusstudio.co.nz <strong>phone:</strong> <p>come and enjoy the comfortable surroundings of our home studio away from the city 'rush' and know that there is a parking space with your name on it. <p>when you arrive, you will find our waiting room to be very comfortable. There are a selection of <p>next door in our camera room is where we will work our magic and give you the individualized attention that is required to give you portraits that are both creative and truly unique. <p>we specialize in the following: <li>pregnancy photos <li>new born photos <li>baby photos <li>toddler photos <li>family photos <li>couple photos <li>special events background: hotpink url(/images/textures /light2a.png); text-shadow: 1px 1px 0 darkslateblue, 2px 2px 3px slateblue;

23 23 of 26 14/11/2014 9:54 a.m. box-shadow: 1px 1px 8px 4px violet; ul { list-style-image: url(/images/silverstar.png); <strong>location:</strong> Hamilton, New Zealand <strong> </strong> info@focusstudio.co.nz <strong>phone:</strong> <p>come and enjoy the comfortable surroundings of our home studio away from the city 'rush' and know that there is a parking space with your name on it. <p>when you arrive, you will find our waiting room to be very comfortable. There are a selection of <p>next door in our camera room is where we will work our magic and give you the individualized attention that is required to give you portraits that are both creative and truly unique. <p>we specialize in the following: <li>pregnancy photos <li>new born photos <li>baby photos <li>toddler photos <li>family photos <li>couple photos <li>special events background: hotpink url(/images/textures /light2a.png); text-shadow: 1px 1px 0 darkslateblue, 2px 2px 3px slateblue; box-shadow: 1px 1px 8px 4px violet; ul { list-style-image: url(/images/silverstar.png); <header> </header> <section> <strong>location:</strong> Hamilton, New Zealand <strong> </strong> info@focusstudio.co.nz <strong>phone:</strong> <p>come and enjoy the comfortable surroundings of our home studio away from the city 'rush' and know that there is a parking space with your name on it. <p>when you arrive, you will find our waiting room to be very comfortable. There are a selection of <p>next door in our camera room is where we will work our magic and give you the individualized attention that is required to give you portraits that are both creative and truly unique. <p>we specialize in the following: <li>pregnancy photos <li>new born photos <li>baby photos <li>toddler photos <li>family photos <li>couple photos <li>special events </section> <footer> Created by <a href="profile.html">mike, 2012

24 24 of 26 14/11/2014 9:54 a.m. </footer> background: hotpink url(/images/textures /light2a.png); header, footer { background: pink; border: 2px solid deeppink; text-shadow: 1px 1px 0 darkslateblue, 2px 2px 3px slateblue; box-shadow: 1px 1px 8px 4px violet; ul { list-style-image: url(/images/silverstar.png); <header> </header> <section> <strong>location:</strong> Hamilton, New Zealand <strong> </strong> info@focusstudio.co.nz <strong>phone:</strong> <p>come and enjoy the comfortable surroundings of our home studio away from the city 'rush' and know that there is a parking space with your name on it. <p>when you arrive, you will find our waiting room to be very comfortable. There are a selection of <p>next door in our camera room is where we will work our magic and give you the individualized attention that is required to give you portraits that are both creative and truly unique. <p>we specialize in the following: <li>pregnancy photos <li>new born photos <li>baby photos <li>toddler photos <li>family photos <li>couple photos <li>special events </section> <footer> Created by <a href="profile.html">mike, 2012 </footer> background: hotpink url(/images/textures /light2a.png); header, footer { background: pink; border: 2px solid deeppink; text-align: center; text-shadow: 1px 1px 0 darkslateblue, 2px 2px 3px slateblue;

25 25 of 26 14/11/2014 9:54 a.m. box-shadow: 1px 1px 8px 4px violet; text-align: justify; ul { list-style-image: url(/images/silverstar.png); <header> </header> <section> <strong>location:</strong> Hamilton, New Zealand <strong> </strong> info@focusstudio.co.nz <strong>phone:</strong> <p>come and enjoy the comfortable surroundings of our home studio away from the city 'rush' and know that there is a parking space with your name on it. <p>when you arrive, you will find our waiting room to be very comfortable. There are a selection of <p>next door in our camera room is where we will work our magic and give you the individualized attention that is required to give you portraits that are both creative and truly unique. <p>we specialize in the following: <li>pregnancy photos <li>new born photos <li>baby photos <li>toddler photos <li>family photos <li>couple photos <li>special events </section> <footer> Created by <a href="profile.html">mike, 2012 </footer> background: hotpink url(/images/textures /light2a.png); body { header, footer { background: pink; border: 2px solid deeppink; margin: 0-10px; text-align: center; text-shadow: 1px 1px 0 darkslateblue, 2px 2px 3px slateblue; box-shadow: 1px 1px 8px 4px violet; text-align: justify; ul { list-style-image: url(/images/silverstar.png); <header> </header> <section> <strong>location:</strong> Hamilton, New Zealand <strong> </strong> info@focusstudio.co.nz <strong>phone:</strong> <p>come and enjoy the comfortable surroundings of our home studio away from the city 'rush' and know that there is a parking space with your name on it. <p>when you arrive, you will find our waiting room to be very comfortable. There are a selection of <p>next door in our camera room is where we will work our magic and give you the individualized attention that is required to give you portraits that

26 26 of 26 14/11/2014 9:54 a.m. are both creative and truly unique. <p>we specialize in the following: <li>pregnancy photos <li>new born photos <li>baby photos <li>toddler photos <li>family photos <li>couple photos <li>special events </section> <footer> Created by <a href="profile.html">mike, 2012 </footer> background: hotpink url(/images/textures /light2a.png); body { header, footer { background: pink; border: 2px solid deeppink; margin: 0-10px; text-align: center; text-shadow: 1px 1px 0 darkslateblue, 2px 2px 3px slateblue; box-shadow: 1px 1px 8px 4px violet; text-align: justify; ul { list-style-image: url(/images/silverstar.png); <header> </header> <section> <strong>location:</strong> Hamilton, New Zealand <strong> </strong> info@focusstudio.co.nz <strong>phone:</strong> <p>come and enjoy the comfortable surroundings of our home studio away from the city 'rush' and know that there is a parking space with your name on it. <p>when you arrive, you will find our waiting room to be very comfortable. There are a selection of <p>next door in our camera room is where we will work our magic and give you the individualized attention that is required to give you portraits that are both creative and truly unique. <p>we specialize in the following: <li>pregnancy photos <li>new born photos <li>baby photos <li>toddler photos <li>family photos <li>couple photos <li>special events </section> <footer> Created by <a href="profile.html">mike, 2012 <a href=" class="twittershare-button" data-via="codeavengers" data-url=" /business.html">tweet <script src="/js/twitter.js"></script> <div class="fb-like" data-href=" /buisness.html" data-send="false" data-layout="button_count" data-width="450" data-showfaces="false"></div> </footer> <div id="fb-root"></div> <script src="/js/facebook.js"></script>