need help writing this webpage ( https://www.apple.com/mac/ ) soely in HTML scri
ID: 3562734 • Letter: N
Question
need help writing this webpage ( https://www.apple.com/mac/ ) soely in HTML script, barebones without JS or CSS,
This is what I currently have
<html>
<head>
<body>
<ul class="nav">
<li><a href="http://www.apple.com">Home</a></li>
<li><a href="http://www.store.apple.com/us">Store</a></li>
<li><a href="http://www.apple.com/mac/">Mac</a></li>
<li><a href="http://www.apple.com/iphone/">iPhone</a></li>
<li><a href="http://www.apple.com/watch/">Watch</a></li>
<li><a href="http://www.apple.com/ipad/">iPad</a></li>
<li><a href="http://www.apple.com/ipod/">iPod</a></li>
<li><a href="http://www.apple.com/itunes/">iTunes</a></li>
<li><a href="http://www.apple.com/support/">Support</a></li>
<li><a href="">Q</a></li>
</ul>
<ul class="products">
<li>
Mac
<ul>
<li><a href="http://www.apple.com/macbook-air/"><img src="http://images.apple.com/mac/home/images/productbrowser/mac/macbookair.png">MacBook Air</a></li>
<li><a href="http://www.apple.com/macbook-pro/"><img src="http://images.apple.com/mac/home/images/productbrowser/mac/macbookpro.png">MacBook Pro</a></li>
<li><a href="http://www.apple.com/mac-mini/"><img src="http://images.apple.com/mac/home/images/productbrowser/mac/macmini.png">Mac mini</a></li>
<li><a href="http://www.apple.com/imac/"><img src="http://images.apple.com/mac/home/images/productbrowser/mac/imac.png">iMac</a></li>
<li><a href="http://www.apple.com/mac-pro/"><img src="http://images.apple.com/mac/home/images/productbrowser/mac/macpro.png">Mac Pro</a></li>
<li><a href="http://www.apple.com/osx/"><img src=https://www.apple.com/mac/home/images/productbrowser/mac/macosx_mavericks_2x.png>OS X Mavericks</a></li>
</ul>
</li>
<li>
Apps
<ul>
<li><a href="http://www.apple.com/apps/iphoto/"><img src=https://www.apple.com/mac/home/images/productbrowser/apps/iphoto_2x.png>iPhoto</a></li>
<li><a href="http://www.apple.com/apps/imovie/"><img src=https://www.apple.com/mac/home/images/productbrowser/apps/imovie_2x.png>iMovie</a></li>
<li><a href="http://www.apple.com/apps/garageband/"><img src=https://www.apple.com/mac/home/images/productbrowser/apps/garageband_2x.png>GarageBand</a></li>
<li><a href="http://www.apple.com/apps/pages/"><img src=https://www.apple.com/mac/home/images/productbrowser/apps/pages_2x.png>Pages</a></li>
<li><a href="http://www.apple.com/apps/numbers/"><img src=https://www.apple.com/mac/home/images/productbrowser/apps/numbers_2x.png>Numbers</a></li>
<li><a href="http://www.apple.com/apps/keynote/"><img src=https://www.apple.com/mac/home/images/productbrowser/apps/keynote_2x.png>Keynote</a></li>
<li><a href="http://www.apple.com/apps/safari/"><img src=https://www.apple.com/mac/home/images/productbrowser/apps/safari_2x.png>Safari</a></li>
</ul>
</li>
Pro Apps
<ul>
<li><a href="http://www.apple.com/proapps/aperture/"><img src=https://www.apple.com/mac/home/images/productbrowser/proapps/aperture_2x.png>Aperture</a></li>
<li><a href="http://www.apple.com/proapps/final-cut-pro/"><img src=https://www.apple.com/mac/home/images/productbrowser/proapps/final_cut_pro_2x.png>Final Cut Pro X</a></li>
<li><a href="http://www.apple.com/proapps/logic-pro/"><img src=https://www.apple.com/mac/home/images/productbrowser/proapps/logic_pro_x_2x.png>Logic Pro X</a></li>
<li><a href="http://www.apple.com/proapps/mainstage/"><img src=https://www.apple.com/mac/home/images/productbrowser/proapps/main_stage_2x.png>MainStage 3</a></li>
<li><a href="http://www.apple.com/proapps/compressor/"><img src=https://www.apple.com/mac/home/images/productbrowser/proapps/compressor_2x.png>Compressor 4</a></li>
<li><a href="http://www.apple.com/proapps/motion/"><img src=https://www.apple.com/mac/home/images/productbrowser/proapps/motion_2x.png>Motion 5</a></li>
</ul>
</li>
Accessories
<ul>
<li><a href="http://www.apple.com/keyboard/"><img src=https://www.apple.com/mac/home/images/productbrowser/accessories/keyboard_2x.png>Apple Wireless Keyboard</a></li>
<li><a href="http://www.apple.com/magicmouse/"><img src=https://www.apple.com/mac/home/images/productbrowser/accessories/magicmouse_2x.png>Magic Mouse</a></li>
<li><a href="http://www.apple.com/magictrackpad/"><img src=https://www.apple.com/mac/home/images/productbrowser/accessories/magictrackpad_2x.png>Magic Trackpad</a></li>
<li><a href="http://www.apple.com/displays/"><img src=https://www.apple.com/mac/home/images/productbrowser/accessories/display_2x.png>Apple Thunderbolt Display </a></li>
<li><a href="http://www.apple.com/proapps/airport-express/"><img src=https://www.apple.com/mac/home/images/productbrowser/accessories/airportexpress_2x.png>AirPort Express</a></li>
<li><a href="http://www.apple.com/airport-extreme/"><img src=https://www.apple.com/mac/home/images/productbrowser/accessories/airportextreme_2x.png>AirPort Extreme</a></li>
<li><a href="http://www.apple.com/airport-time-capsule/"><img src=https://www.apple.com/mac/home/images/productbrowser/accessories/airporttimecapsule_2x.png>AirPort Time Capsule</a></li>
</ul>
</li>
<ul class="promotion">
<li><a href="https://www.apple.com/osx/preview/"><span>OS X Yosemite</span><span>Every bit as powerful as it looks.</span></a></li>
<li><a href="https://www.apple.com/mac-pro/"><span>Mac Pro</span><span>Built for creativity on an epic scale.</span></a></li>
<li><a href="https://www.apple.com/U2/"><span>The new album from U2 is here.</span><span>And it's already in your iTunes music library.</span></a></li>
</ul>
</body></html>
Explanation / Answer
What we just did: we established two styles. One style is for the lightbox that actually appears on the page (#lightbox). The second style is for lightbox background (#lightbox-shadow). We have made this background dark and semi-transparent in order to dim the site
Related Questions
Navigate
Integrity-first tutoring: explanations and feedback only — we do not complete graded work. Learn more.