Question

In: Computer Science

create a website that describes a city of your choice. The website must include the following...

create a website that describes a city of your choice. The website must include the following pages:  Home Page  Arts & Culture  News & Events  Recreation

Requirements

Write from scratch the HTML and CSS files and show your creativity, aesthetics and imagination.

Begin by creating a wireframe diagram that indicates the structure of the web page

. Use grammatically correct sentences that provide reasonable flow through each web page. Include the following:

 Structural elements (header, nav, main, div and footer)

 Headings (h1, h2, etc.), paragraphs, blockquote and span

 At least five different phrasing elements in your website that fit the flow of the page

 Unordered list and description list

 Three special characters (entity characters)

 CSS properties (configure color, background, text, padding, border, margin, box-shadow, opacity)

 CSS Id, class and descendant selectors  Images with captions (use figcaption)

 Favicon

 At least one background image that configures a linear or a radial gradient

Solutions

Expert Solution

Heirarchy of folder:

images used in project:

index.html:

<!DOCTYPE html>

<html>

<head>

    <link rel="icon" href="/1.jpg" type="image" sizes="20x20">

<style>

* {

  box-sizing: border-box;

}

body {

  font-family: Arial;

  padding: 10px;

  background: #f1f1f1;

}


.header {

  padding: 30px;

  text-align: center;

  background: white;

}

.header h1 {

  font-size: 50px;

}


.nav-bar {

  overflow: hidden;

  background-color: rgb(46, 45, 45);

}


.nav-bar a {

  float: left;

  display: block;

  color: #e0d2d2;

  text-align: center;

  padding: 15px 18px;

  text-decoration: none;

}



.footer {

  padding: 5px;

  text-align: center;

  background: rgb(146, 136, 136);

  margin-top: 5px;

}


#bg-grad {

  height: 200px;

  background-color: yellow; /* For browsers that do not support gradients */

  background-image: linear-gradient(to right, rgb(224, 131, 131) , rgb(223, 223, 136));

}


@media screen and (max-width: 400px) {

  .nav-bar a {

    float: none;

    width: 100%;

  }

}

</style>

</head>

<body>

<header>

    <div class="header">

        <h1>LONDON</h1>

        <h2>My favourite city.</h2>

        <nav>

            <div class="nav-bar">

                <a href="#">Home</a>

                <a href="#">Arts & Culture</a>

                <a href="#">News & Events</a>

                <a href="#">Recreation</a>

              </div>

        </nav>

      </div>

</header>

<main>

    <section>

        <div id="bg-grad"></div>

        <div>

            <h3>Explore London</h3>

            <p>London is the capital and largest city of England and the United Kingdom.[8][9] The city stands on the River Thames in the south-east of England, at the head of its 50-mile (80 km) estuary leading to the North Sea. London has been a major settlement for two millennia. Londinium was founded by the Romans.[10] The City of London, London's ancient core and financial centre − an area of just 1.12 square miles (2.9 km2) and colloquially known as the Square Mile − retains boundaries that closely follow its medieval limits.[11][12][13][14][15][note 1] The adjacent City of Westminster is an Inner London borough and has for centuries been the location of much of the national government. Thirty one additional boroughs north and south of the river also comprise modern London. London is governed by the mayor of London and the London Assembly</p>

        </div>

        <div>

            <h6>Places to visit in London | where history happens</h6>

            <ul>

                <li>London bridge</li>

                <li>Abbe</li>

                <li>Efiel Tower</li>

            </ul>

        </div>

    </section>

</main>




<footer>

    <div class="footer">

        <h2> &copy; All rights reserved!</h2>

      </div>

</footer>


</body>

</html>


Related Solutions

You will be expected to complete a website of your choice. This website must incorporate a...
You will be expected to complete a website of your choice. This website must incorporate a PHP component, in this case, a form that we will be working on in class. When in doubt, carry out research to see what you could add. There are videos in the required resources section to assist anyone who is not familiar with building a website. Be sure to consult your instructor if additional support is needed. The first task is to have your...
You will be expected to complete a website of your choice. This website must incorporate a...
You will be expected to complete a website of your choice. This website must incorporate a PHP component, in this case, a form that we will be working on in class. When in doubt, carry out research to see what you could add. There are videos in the required resources section to assist anyone who is not familiar with building a website. Be sure to consult your instructor if additional support is needed. The first task is to have your...
Questions for: Civic Disturbance in City Hall/ Sentinel City. Create a report that describes the potential...
Questions for: Civic Disturbance in City Hall/ Sentinel City. Create a report that describes the potential public health effects and environmental hazards related to the civic disturbance. Describe the members and roles of the emergency response team and organizations (public and private) that could be activated in Sentinel City®. Present an analysis of the risks and benefits of social media responses from the area. Select a healthcare practice setting, such as urgent care clinic, school, or hospital unit (ER, Surgery,...
Create a game of your choice that involves the following concepts:
C++ PROJECTCreate a game of your choice that involves the following concepts:STL library. (Maps, Sets, Lists, Stacks and Queues), with Iterators and AlgorithmsShow especially Especially Algorithm/Iterators/Containers in the STLMinimum of 750 linesInclude Full documentation
Create a project charter. Choose a business of your own. The business must include (but is...
Create a project charter. Choose a business of your own. The business must include (but is not limited to) the following criteria: Clear business objective and a specific completion outcome. Project team has at least three members (not including you, the project manager), each with defined roles and responsibilities. Completion window of 180 days. Cost estimates that serve as the basis for a budget are used as part of the plan development process. Business Need. Project Objectives. Describe the business...
Minimum Requirements: Your website must include appropriate and understandable page titles for each page. These titles...
Minimum Requirements: Your website must include appropriate and understandable page titles for each page. These titles display at the top of the browser when users view your pages Must have a minimum of three sub-pages excluding the homepage. Additional pages MUST be subpages linked off the homepage Homepage: This page will include a brief introduction of the site, links to the other pages, pictures, etc. Name the Homepage file ‘index.html’ About me page: this page tells about yourself and everything...
Write an informal business report of your choice. The report must include all 3 sections of...
Write an informal business report of your choice. The report must include all 3 sections of an informal report - Introduction, discussion section and conclusion).
First, search the internet for the official website of your local city government or a city...
First, search the internet for the official website of your local city government or a city that interests you. After reviewing the website, locate the latest comprehensive annual financial report (CAFR) available on the website. For example, both the City of Sacramento and the City of Phoenix have their most recent CAFRs online within an accounting/financial section. Use the financial statements you locate to address the following questions: USE CITY OF NEW YORK AND TARGET TO COMPARE - ANSWER THE...
First, search the internet for the official website of your local city government or a city...
First, search the internet for the official website of your local city government or a city that interests you. After reviewing the website, locate the latest comprehensive annual financial report (CAFR) available on the website. For example, both the City of Sacramento and the City of Phoenix have their most recent CAFRs online within an accounting/financial section. Use the financial statements you locate to address the following questions: USE NEW YORK STATE AND TARGET TO COMPARE How does the audit...
Which of the following terms describes the next best alternative that must be sacrificed as a result of making a particular choice?
Which of the following terms describes the next best alternative that must be sacrificed as a result of making a particular choice? Microeconomics. Opportunity cost  Macroeconomics. Scarcity. 
ADVERTISEMENT
ADVERTISEMENT
ADVERTISEMENT