SlideShare una empresa de Scribd logo
1 de 2
In this assignment, you will be designing a web page for Presidents of Korea.

I am providing you with the following files:

     1.   presidents.html – this is the HTML file.

     2.   presidents_style.css – this is the css file.

     3.   images folder – this folder contain images of Presidents of Korea.

The HTML file presidents.html has the following layout: navbar and main are the name of styles in CSS file.




Your assignment is to modify presidents.html file to produce the following:




Do the following:

     1.   Modify the presidents_style.css stylesheet to produce the above web page. DON’T modify presidents.html.

     2.   In the above file, each image is 200 pixels wide and 250 pixels high.
3.   The name of each president is centered below the image of and is ordered blue.

     4.   The background color of the image is aqua.

     5.   The width between the image boundary and frame boundary is 25 pixels.

     6.   Each frame president is separated by 25 pixels of white space from adjacent framed president and from top and left
          edges of the browser body display area.

     7.   The 2x2 arragment of presidents would be maintained regardless of the width of the browser window.

Create a new file navbar.html - it contains the menu on the left, similar to the image above.

          1.   This first link, Home Page, is the link to presidents.html page.

          2.   The second link, Rhee Syng-Man, is the link that you will be creating.

          3.   The rest of the 3 links are dummy links.

You can create a page rhee.html that will have a short description of 1000 words about the President Rhee Syung-Man. This web
page should describe the life and works of President Rhee Syun-Man.

Hint: You might need to check how to include an html file inside another file. There is “include” tag in HTML that you might
want to explore.

Más contenido relacionado

Similar a Assignment description

Web design in 7 days by waqar
Web design in 7 days by waqarWeb design in 7 days by waqar
Web design in 7 days by waqar
Waqar Chodhry
 
Intermediate Web Design.doc
Intermediate Web Design.docIntermediate Web Design.doc
Intermediate Web Design.doc
butest
 
Intermediate Web Design.doc
Intermediate Web Design.docIntermediate Web Design.doc
Intermediate Web Design.doc
butest
 
Lecture 2 HTML part 1.pptxLecture 10 CSS part 2.pptxvvvvvvvvvvvvvv
Lecture 2 HTML part 1.pptxLecture 10 CSS part 2.pptxvvvvvvvvvvvvvvLecture 2 HTML part 1.pptxLecture 10 CSS part 2.pptxvvvvvvvvvvvvvv
Lecture 2 HTML part 1.pptxLecture 10 CSS part 2.pptxvvvvvvvvvvvvvv
ZahouAmel1
 
Html web designing 1
Html web designing 1Html web designing 1
Html web designing 1
mannely
 
Building A Website
Building A WebsiteBuilding A Website
Building A Website
marabeas
 

Similar a Assignment description (20)

WEB DEVELOPMENT
WEB DEVELOPMENTWEB DEVELOPMENT
WEB DEVELOPMENT
 
Final_Frames.pptx
Final_Frames.pptxFinal_Frames.pptx
Final_Frames.pptx
 
HTML5 - Insert images and Apply page backgrounds
HTML5 - Insert images and Apply page backgroundsHTML5 - Insert images and Apply page backgrounds
HTML5 - Insert images and Apply page backgrounds
 
CSS_tutorial_1
CSS_tutorial_1CSS_tutorial_1
CSS_tutorial_1
 
CSS_tutorial_1
CSS_tutorial_1CSS_tutorial_1
CSS_tutorial_1
 
Thinkful - HTML/CSS Crash Course (May 4 2017)
Thinkful - HTML/CSS Crash Course (May 4 2017)Thinkful - HTML/CSS Crash Course (May 4 2017)
Thinkful - HTML/CSS Crash Course (May 4 2017)
 
Web engineering and Technology
Web engineering and TechnologyWeb engineering and Technology
Web engineering and Technology
 
Web design in 7 days by waqar
Web design in 7 days by waqarWeb design in 7 days by waqar
Web design in 7 days by waqar
 
Web design in 7 days
Web design in 7 daysWeb design in 7 days
Web design in 7 days
 
Html basics
Html basicsHtml basics
Html basics
 
Introduction to-concrete-5
Introduction to-concrete-5Introduction to-concrete-5
Introduction to-concrete-5
 
Introduction to-concrete-5
Introduction to-concrete-5Introduction to-concrete-5
Introduction to-concrete-5
 
Intermediate Web Design.doc
Intermediate Web Design.docIntermediate Web Design.doc
Intermediate Web Design.doc
 
Intermediate Web Design.doc
Intermediate Web Design.docIntermediate Web Design.doc
Intermediate Web Design.doc
 
Basic html tutoirialp2
Basic html tutoirialp2Basic html tutoirialp2
Basic html tutoirialp2
 
Lecture 2 HTML part 1.pptxLecture 10 CSS part 2.pptxvvvvvvvvvvvvvv
Lecture 2 HTML part 1.pptxLecture 10 CSS part 2.pptxvvvvvvvvvvvvvvLecture 2 HTML part 1.pptxLecture 10 CSS part 2.pptxvvvvvvvvvvvvvv
Lecture 2 HTML part 1.pptxLecture 10 CSS part 2.pptxvvvvvvvvvvvvvv
 
Frames.ppt
Frames.pptFrames.ppt
Frames.ppt
 
Html web designing 1
Html web designing 1Html web designing 1
Html web designing 1
 
HTML/CSS Crash Course (april 4 2017)
HTML/CSS Crash Course (april 4 2017)HTML/CSS Crash Course (april 4 2017)
HTML/CSS Crash Course (april 4 2017)
 
Building A Website
Building A WebsiteBuilding A Website
Building A Website
 

Más de H K (20)

Assignment4
Assignment4Assignment4
Assignment4
 
Assignment3
Assignment3Assignment3
Assignment3
 
Induction
InductionInduction
Induction
 
Solution3
Solution3Solution3
Solution3
 
Solution2
Solution2Solution2
Solution2
 
Mid-
Mid-Mid-
Mid-
 
Assignment4
Assignment4Assignment4
Assignment4
 
Assignment4
Assignment4Assignment4
Assignment4
 
Dm assignment3
Dm assignment3Dm assignment3
Dm assignment3
 
Proof
ProofProof
Proof
 
Resolution
ResolutionResolution
Resolution
 
Dm assignment2
Dm assignment2Dm assignment2
Dm assignment2
 
Set
SetSet
Set
 
Dm assignment1
Dm assignment1Dm assignment1
Dm assignment1
 
Logic
LogicLogic
Logic
 
Introduction
IntroductionIntroduction
Introduction
 
Assignment 2 sol
Assignment 2 solAssignment 2 sol
Assignment 2 sol
 
Assignment sw solution
Assignment sw solutionAssignment sw solution
Assignment sw solution
 
Violinphoenix
ViolinphoenixViolinphoenix
Violinphoenix
 
Ie project
Ie projectIe project
Ie project
 

Último

Architecting Cloud Native Applications
Architecting Cloud Native ApplicationsArchitecting Cloud Native Applications
Architecting Cloud Native Applications
WSO2
 

Último (20)

presentation ICT roal in 21st century education
presentation ICT roal in 21st century educationpresentation ICT roal in 21st century education
presentation ICT roal in 21st century education
 
Apidays Singapore 2024 - Modernizing Securities Finance by Madhu Subbu
Apidays Singapore 2024 - Modernizing Securities Finance by Madhu SubbuApidays Singapore 2024 - Modernizing Securities Finance by Madhu Subbu
Apidays Singapore 2024 - Modernizing Securities Finance by Madhu Subbu
 
TrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
TrustArc Webinar - Unlock the Power of AI-Driven Data DiscoveryTrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
TrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
 
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemkeProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
 
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
 
Boost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdfBoost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdf
 
Architecting Cloud Native Applications
Architecting Cloud Native ApplicationsArchitecting Cloud Native Applications
Architecting Cloud Native Applications
 
Manulife - Insurer Transformation Award 2024
Manulife - Insurer Transformation Award 2024Manulife - Insurer Transformation Award 2024
Manulife - Insurer Transformation Award 2024
 
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, AdobeApidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
 
Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024
 
ICT role in 21st century education and its challenges
ICT role in 21st century education and its challengesICT role in 21st century education and its challenges
ICT role in 21st century education and its challenges
 
AXA XL - Insurer Innovation Award Americas 2024
AXA XL - Insurer Innovation Award Americas 2024AXA XL - Insurer Innovation Award Americas 2024
AXA XL - Insurer Innovation Award Americas 2024
 
Corporate and higher education May webinar.pptx
Corporate and higher education May webinar.pptxCorporate and higher education May webinar.pptx
Corporate and higher education May webinar.pptx
 
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
 
FWD Group - Insurer Innovation Award 2024
FWD Group - Insurer Innovation Award 2024FWD Group - Insurer Innovation Award 2024
FWD Group - Insurer Innovation Award 2024
 
Automating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps ScriptAutomating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps Script
 
Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...
Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...
Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...
 
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerHow to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected Worker
 
Ransomware_Q4_2023. The report. [EN].pdf
Ransomware_Q4_2023. The report. [EN].pdfRansomware_Q4_2023. The report. [EN].pdf
Ransomware_Q4_2023. The report. [EN].pdf
 
DBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor PresentationDBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor Presentation
 

Assignment description

  • 1. In this assignment, you will be designing a web page for Presidents of Korea. I am providing you with the following files: 1. presidents.html – this is the HTML file. 2. presidents_style.css – this is the css file. 3. images folder – this folder contain images of Presidents of Korea. The HTML file presidents.html has the following layout: navbar and main are the name of styles in CSS file. Your assignment is to modify presidents.html file to produce the following: Do the following: 1. Modify the presidents_style.css stylesheet to produce the above web page. DON’T modify presidents.html. 2. In the above file, each image is 200 pixels wide and 250 pixels high.
  • 2. 3. The name of each president is centered below the image of and is ordered blue. 4. The background color of the image is aqua. 5. The width between the image boundary and frame boundary is 25 pixels. 6. Each frame president is separated by 25 pixels of white space from adjacent framed president and from top and left edges of the browser body display area. 7. The 2x2 arragment of presidents would be maintained regardless of the width of the browser window. Create a new file navbar.html - it contains the menu on the left, similar to the image above. 1. This first link, Home Page, is the link to presidents.html page. 2. The second link, Rhee Syng-Man, is the link that you will be creating. 3. The rest of the 3 links are dummy links. You can create a page rhee.html that will have a short description of 1000 words about the President Rhee Syung-Man. This web page should describe the life and works of President Rhee Syun-Man. Hint: You might need to check how to include an html file inside another file. There is “include” tag in HTML that you might want to explore.