SlideShare une entreprise Scribd logo
1  sur  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.

Contenu connexe

Similaire à Assignment description

Final_Frames.pptx
Final_Frames.pptxFinal_Frames.pptx
Final_Frames.pptxSajalZawar
 
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 backgroundsGrayzon Gonzales, LPT
 
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)TJ Stalcup
 
Web engineering and Technology
Web engineering and TechnologyWeb engineering and Technology
Web engineering and Technologychirag patil
 
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 waqarWaqar Chodhry
 
Introduction to-concrete-5
Introduction to-concrete-5Introduction to-concrete-5
Introduction to-concrete-5Ketan Raval
 
Introduction to-concrete-5
Introduction to-concrete-5Introduction to-concrete-5
Introduction to-concrete-5ketanraval
 
Intermediate Web Design.doc
Intermediate Web Design.docIntermediate Web Design.doc
Intermediate Web Design.docbutest
 
Intermediate Web Design.doc
Intermediate Web Design.docIntermediate Web Design.doc
Intermediate Web Design.docbutest
 
Basic html tutoirialp2
Basic html tutoirialp2Basic html tutoirialp2
Basic html tutoirialp2prasadmvreddy
 
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.pptxvvvvvvvvvvvvvvZahouAmel1
 
Html web designing 1
Html web designing 1Html web designing 1
Html web designing 1mannely
 
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)Daniel Friedman
 
Building A Website
Building A WebsiteBuilding A Website
Building A Websitemarabeas
 

Similaire à 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
Web design in 7 daysWeb design in 7 days
Web design in 7 days
 
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
 
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
 

Plus de H K

Assignment4
Assignment4Assignment4
Assignment4H K
 
Assignment3
Assignment3Assignment3
Assignment3H K
 
Induction
InductionInduction
InductionH K
 
Solution3
Solution3Solution3
Solution3H K
 
Solution2
Solution2Solution2
Solution2H K
 
Mid-
Mid-Mid-
Mid-H K
 
Assignment4
Assignment4Assignment4
Assignment4H K
 
Assignment4
Assignment4Assignment4
Assignment4H K
 
Dm assignment3
Dm assignment3Dm assignment3
Dm assignment3H K
 
Proof
ProofProof
ProofH K
 
Resolution
ResolutionResolution
ResolutionH K
 
Dm assignment2
Dm assignment2Dm assignment2
Dm assignment2H K
 
Set
SetSet
SetH K
 
Dm assignment1
Dm assignment1Dm assignment1
Dm assignment1H K
 
Logic
LogicLogic
LogicH K
 
Introduction
IntroductionIntroduction
IntroductionH K
 
Assignment 2 sol
Assignment 2 solAssignment 2 sol
Assignment 2 solH K
 
Assignment sw solution
Assignment sw solutionAssignment sw solution
Assignment sw solutionH K
 
Violinphoenix
ViolinphoenixViolinphoenix
ViolinphoenixH K
 
Ie project
Ie projectIe project
Ie projectH K
 

Plus 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
 

Dernier

Emixa Mendix Meetup 11 April 2024 about Mendix Native development
Emixa Mendix Meetup 11 April 2024 about Mendix Native developmentEmixa Mendix Meetup 11 April 2024 about Mendix Native development
Emixa Mendix Meetup 11 April 2024 about Mendix Native developmentPim van der Noll
 
Testing tools and AI - ideas what to try with some tool examples
Testing tools and AI - ideas what to try with some tool examplesTesting tools and AI - ideas what to try with some tool examples
Testing tools and AI - ideas what to try with some tool examplesKari Kakkonen
 
Varsha Sewlal- Cyber Attacks on Critical Critical Infrastructure
Varsha Sewlal- Cyber Attacks on Critical Critical InfrastructureVarsha Sewlal- Cyber Attacks on Critical Critical Infrastructure
Varsha Sewlal- Cyber Attacks on Critical Critical Infrastructureitnewsafrica
 
The State of Passkeys with FIDO Alliance.pptx
The State of Passkeys with FIDO Alliance.pptxThe State of Passkeys with FIDO Alliance.pptx
The State of Passkeys with FIDO Alliance.pptxLoriGlavin3
 
Bridging Between CAD & GIS: 6 Ways to Automate Your Data Integration
Bridging Between CAD & GIS:  6 Ways to Automate Your Data IntegrationBridging Between CAD & GIS:  6 Ways to Automate Your Data Integration
Bridging Between CAD & GIS: 6 Ways to Automate Your Data Integrationmarketing932765
 
Modern Roaming for Notes and Nomad – Cheaper Faster Better Stronger
Modern Roaming for Notes and Nomad – Cheaper Faster Better StrongerModern Roaming for Notes and Nomad – Cheaper Faster Better Stronger
Modern Roaming for Notes and Nomad – Cheaper Faster Better Strongerpanagenda
 
Generative AI - Gitex v1Generative AI - Gitex v1.pptx
Generative AI - Gitex v1Generative AI - Gitex v1.pptxGenerative AI - Gitex v1Generative AI - Gitex v1.pptx
Generative AI - Gitex v1Generative AI - Gitex v1.pptxfnnc6jmgwh
 
Potential of AI (Generative AI) in Business: Learnings and Insights
Potential of AI (Generative AI) in Business: Learnings and InsightsPotential of AI (Generative AI) in Business: Learnings and Insights
Potential of AI (Generative AI) in Business: Learnings and InsightsRavi Sanghani
 
Scale your database traffic with Read & Write split using MySQL Router
Scale your database traffic with Read & Write split using MySQL RouterScale your database traffic with Read & Write split using MySQL Router
Scale your database traffic with Read & Write split using MySQL RouterMydbops
 
Long journey of Ruby standard library at RubyConf AU 2024
Long journey of Ruby standard library at RubyConf AU 2024Long journey of Ruby standard library at RubyConf AU 2024
Long journey of Ruby standard library at RubyConf AU 2024Hiroshi SHIBATA
 
TrustArc Webinar - How to Build Consumer Trust Through Data Privacy
TrustArc Webinar - How to Build Consumer Trust Through Data PrivacyTrustArc Webinar - How to Build Consumer Trust Through Data Privacy
TrustArc Webinar - How to Build Consumer Trust Through Data PrivacyTrustArc
 
2024 April Patch Tuesday
2024 April Patch Tuesday2024 April Patch Tuesday
2024 April Patch TuesdayIvanti
 
Unleashing Real-time Insights with ClickHouse_ Navigating the Landscape in 20...
Unleashing Real-time Insights with ClickHouse_ Navigating the Landscape in 20...Unleashing Real-time Insights with ClickHouse_ Navigating the Landscape in 20...
Unleashing Real-time Insights with ClickHouse_ Navigating the Landscape in 20...Alkin Tezuysal
 
So einfach geht modernes Roaming fuer Notes und Nomad.pdf
So einfach geht modernes Roaming fuer Notes und Nomad.pdfSo einfach geht modernes Roaming fuer Notes und Nomad.pdf
So einfach geht modernes Roaming fuer Notes und Nomad.pdfpanagenda
 
Design pattern talk by Kaya Weers - 2024 (v2)
Design pattern talk by Kaya Weers - 2024 (v2)Design pattern talk by Kaya Weers - 2024 (v2)
Design pattern talk by Kaya Weers - 2024 (v2)Kaya Weers
 
A Deep Dive on Passkeys: FIDO Paris Seminar.pptx
A Deep Dive on Passkeys: FIDO Paris Seminar.pptxA Deep Dive on Passkeys: FIDO Paris Seminar.pptx
A Deep Dive on Passkeys: FIDO Paris Seminar.pptxLoriGlavin3
 
Genislab builds better products and faster go-to-market with Lean project man...
Genislab builds better products and faster go-to-market with Lean project man...Genislab builds better products and faster go-to-market with Lean project man...
Genislab builds better products and faster go-to-market with Lean project man...Farhan Tariq
 
Time Series Foundation Models - current state and future directions
Time Series Foundation Models - current state and future directionsTime Series Foundation Models - current state and future directions
Time Series Foundation Models - current state and future directionsNathaniel Shimoni
 
UiPath Community: Communication Mining from Zero to Hero
UiPath Community: Communication Mining from Zero to HeroUiPath Community: Communication Mining from Zero to Hero
UiPath Community: Communication Mining from Zero to HeroUiPathCommunity
 
The Future Roadmap for the Composable Data Stack - Wes McKinney - Data Counci...
The Future Roadmap for the Composable Data Stack - Wes McKinney - Data Counci...The Future Roadmap for the Composable Data Stack - Wes McKinney - Data Counci...
The Future Roadmap for the Composable Data Stack - Wes McKinney - Data Counci...Wes McKinney
 

Dernier (20)

Emixa Mendix Meetup 11 April 2024 about Mendix Native development
Emixa Mendix Meetup 11 April 2024 about Mendix Native developmentEmixa Mendix Meetup 11 April 2024 about Mendix Native development
Emixa Mendix Meetup 11 April 2024 about Mendix Native development
 
Testing tools and AI - ideas what to try with some tool examples
Testing tools and AI - ideas what to try with some tool examplesTesting tools and AI - ideas what to try with some tool examples
Testing tools and AI - ideas what to try with some tool examples
 
Varsha Sewlal- Cyber Attacks on Critical Critical Infrastructure
Varsha Sewlal- Cyber Attacks on Critical Critical InfrastructureVarsha Sewlal- Cyber Attacks on Critical Critical Infrastructure
Varsha Sewlal- Cyber Attacks on Critical Critical Infrastructure
 
The State of Passkeys with FIDO Alliance.pptx
The State of Passkeys with FIDO Alliance.pptxThe State of Passkeys with FIDO Alliance.pptx
The State of Passkeys with FIDO Alliance.pptx
 
Bridging Between CAD & GIS: 6 Ways to Automate Your Data Integration
Bridging Between CAD & GIS:  6 Ways to Automate Your Data IntegrationBridging Between CAD & GIS:  6 Ways to Automate Your Data Integration
Bridging Between CAD & GIS: 6 Ways to Automate Your Data Integration
 
Modern Roaming for Notes and Nomad – Cheaper Faster Better Stronger
Modern Roaming for Notes and Nomad – Cheaper Faster Better StrongerModern Roaming for Notes and Nomad – Cheaper Faster Better Stronger
Modern Roaming for Notes and Nomad – Cheaper Faster Better Stronger
 
Generative AI - Gitex v1Generative AI - Gitex v1.pptx
Generative AI - Gitex v1Generative AI - Gitex v1.pptxGenerative AI - Gitex v1Generative AI - Gitex v1.pptx
Generative AI - Gitex v1Generative AI - Gitex v1.pptx
 
Potential of AI (Generative AI) in Business: Learnings and Insights
Potential of AI (Generative AI) in Business: Learnings and InsightsPotential of AI (Generative AI) in Business: Learnings and Insights
Potential of AI (Generative AI) in Business: Learnings and Insights
 
Scale your database traffic with Read & Write split using MySQL Router
Scale your database traffic with Read & Write split using MySQL RouterScale your database traffic with Read & Write split using MySQL Router
Scale your database traffic with Read & Write split using MySQL Router
 
Long journey of Ruby standard library at RubyConf AU 2024
Long journey of Ruby standard library at RubyConf AU 2024Long journey of Ruby standard library at RubyConf AU 2024
Long journey of Ruby standard library at RubyConf AU 2024
 
TrustArc Webinar - How to Build Consumer Trust Through Data Privacy
TrustArc Webinar - How to Build Consumer Trust Through Data PrivacyTrustArc Webinar - How to Build Consumer Trust Through Data Privacy
TrustArc Webinar - How to Build Consumer Trust Through Data Privacy
 
2024 April Patch Tuesday
2024 April Patch Tuesday2024 April Patch Tuesday
2024 April Patch Tuesday
 
Unleashing Real-time Insights with ClickHouse_ Navigating the Landscape in 20...
Unleashing Real-time Insights with ClickHouse_ Navigating the Landscape in 20...Unleashing Real-time Insights with ClickHouse_ Navigating the Landscape in 20...
Unleashing Real-time Insights with ClickHouse_ Navigating the Landscape in 20...
 
So einfach geht modernes Roaming fuer Notes und Nomad.pdf
So einfach geht modernes Roaming fuer Notes und Nomad.pdfSo einfach geht modernes Roaming fuer Notes und Nomad.pdf
So einfach geht modernes Roaming fuer Notes und Nomad.pdf
 
Design pattern talk by Kaya Weers - 2024 (v2)
Design pattern talk by Kaya Weers - 2024 (v2)Design pattern talk by Kaya Weers - 2024 (v2)
Design pattern talk by Kaya Weers - 2024 (v2)
 
A Deep Dive on Passkeys: FIDO Paris Seminar.pptx
A Deep Dive on Passkeys: FIDO Paris Seminar.pptxA Deep Dive on Passkeys: FIDO Paris Seminar.pptx
A Deep Dive on Passkeys: FIDO Paris Seminar.pptx
 
Genislab builds better products and faster go-to-market with Lean project man...
Genislab builds better products and faster go-to-market with Lean project man...Genislab builds better products and faster go-to-market with Lean project man...
Genislab builds better products and faster go-to-market with Lean project man...
 
Time Series Foundation Models - current state and future directions
Time Series Foundation Models - current state and future directionsTime Series Foundation Models - current state and future directions
Time Series Foundation Models - current state and future directions
 
UiPath Community: Communication Mining from Zero to Hero
UiPath Community: Communication Mining from Zero to HeroUiPath Community: Communication Mining from Zero to Hero
UiPath Community: Communication Mining from Zero to Hero
 
The Future Roadmap for the Composable Data Stack - Wes McKinney - Data Counci...
The Future Roadmap for the Composable Data Stack - Wes McKinney - Data Counci...The Future Roadmap for the Composable Data Stack - Wes McKinney - Data Counci...
The Future Roadmap for the Composable Data Stack - Wes McKinney - Data Counci...
 

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.