See the attacg=hed question file

See the attacg=hed question file
Fall 202 2 CIS 525 Date last modifie d: 202 2_09_ 20 HW 4, Adding CSS – Part 2 (HTML & CSS) with Notepad++ In this homework, you will be using a more “powerful” text editor / programming environment: notepad++ ( Windows) for TextMate or BBEdit (Mac) Continue developing the same basic HTML website you created for HW3. ( If you prefer, you can start new website , but it needs to have all of the requirements f rom H W3 ) Watch this video first before starting . Downloading and using Notepad ++: A. https://www.youtube.com/watch?v=oQbCbTg2EfM (intro 8 min , navigating Notepad ++) B. https://www.youtube.com/watch?v=b9dYFB2swZs (in depth, 38 min , creating simple website using notepad ++ with HTML ) Using CSS in notepad ++: C. https://www.youtube.com/watch?v=nxb3smCSDEI (int ro 24 min, using CSS file) CSS advanced: (see section 2,3,8 ) (though not using notepad++ , sec 3 shows utili zes rounded and hover ) D. https://www.youtube.com/watch?v=G3e -cpL7ofc Check list: 1. Implement color with three types: Name, RGB, and Hexadecimal ( opti onal opacity – 4th parameter ) 2. Include three different ways to access CSS sel ectors (by Class, HTML tag , and ID) 3. Include use of different box model styles: ( padding, margin , border, etc.) – demonstrate difference in screen shot. 4. Include all the three differe nt types of CSS (inl ine, embedded (head) , and external – separate css file) . Though s eparate is the preferred – you are just pr actic ing the three different types. (Show screen shots of each) 5. Prove C SS overrid ing pro perty. Include sc reenshot. External File -> (top to down, unless ID), Head same file, inline style 6. Include CSS comments. /* ….. */ and // 7. View i n different la youts – half screen size . – document issues. 8. Include an example of Block vs Inline and override the default HTML with CSS (changing a normal block to inlin e an d inline to block) 9. Inclu de the overflow property and de monstrate good examples of each. 10. Use the Font property and show example of font pre ced ence. (for e xample : if Comic Sans was not on local device) 11. Ma ke your hyperlinks into buttons instead of text and implement both hover and rounded edges (see sec 3 from video D) 12. Check using the CSS validator. Paste the report. Fix the Errors but you can ignore the warnings. https://jigsaw.w3.org/css -validator/ 13. Optional: Implement the Zebra or stripped rows /co lumns format ting by using CSS nth -child (will need to implem ent in later h w) Documen tation: Submit assignment to Canvas (Assignment 4) as Word or PDF and include the following: Student Name and Section Number: Website Files : Zip up: HTML pages / CSS (should be a separate folder CSS and Images files (optional for HTML) ) Website Summary (What type of website, why did you choose, short summary about website) around 100 – 200 words: Website Navigation : Use any software to show your hierarchal website navigation with thumbnail image of each page, including folders Website Issues (How did y ou resolve) around (100 – 200 words) – for example in half -screen view – did you page still look as exp ected? If not, h ow did you resolve ? Future Plans to implement (100 – 200 words): Homework Summary: ( 100 – 200 words): learning topics from this lab or other summary comments. How important is CSS? It is difficult to use compa red to HT ML? You will be submitting two files: A documentation file and a website zipped file: Name the files something useful such as: HW 4_YourName