SOP. 1/CHP 1 IT 12TH COMMERCE

on

 Question. 1

Create a website using html5 and CSS using any 4 CSS properties. Write a code for 2 separate pages having different file name such first page as in- dex.html, 2nd page as page2.html as form.html. Use any theme such as college profile or company profile etc. Every page must contain proper Meta information and design webpage as follows-

The index page must contain a heading which is highest among other text on pages and must be at center of the page. There must be a paragraph which introduces general information about the theme chosen must have at least 3 physical style tags and one image with alternate text. This page must be connected to other two pages with proper navigational links.

The 2nd page must contain the feedback or enrollment form related with theme chosen with feature of html5. The form must contain text element and email address of the company or person .Include the submit button.

Coding for the following question:-


First Page 

<!DOCTYPE html>
<head>
    <meta charset="UTF-8">
    <title>College Profile</title>
    <style>
        body {
            background-color: powderblue;
        }
        h1 {
            color: blue;
            text-align: center;
            text-decoration: underline;
        }
        p {
            font-weight: bold;
            color: red;
            font-style: italic;
        }
    </style>
</head>
<body>
    <h1>KES Shroff Junior College of Arts & Commerce</h1>
    <p>
        <span style="font-size: 24px; font-family: monospace;">
            KES Shroff College of Arts and Commerce is affiliated to University of Mumbai,
            it is one of the best organizations in the Mumbai suburbs.
            KES was established in the year 1989 & it is
            managed by Kandivali Education Society.
            Various Degree, Diploma and UnderGraduation courses are conducted by the college.
            College received the <mark>'BEST COLLEGE AWARD'</mark> from Mumbai University in the year 2017.
        </span>
    </p>
    <br ><br>
    <div style="text-align: center;">
        <img src="kes.jpg" height="250" width="550" style="border: 3px solid #000;" alt="College Building">
        <br><br>
        <h3><a href="page2.html">Click here to fill Form</a></h3>
    </div>
</body>
</html>


Second Page

<!DOCTYPE html>
<head>
    <title>College Profile 2</title>
    <style>
        body {
            background-color: powderblue;
        }

        h1 {
            color: blue;
            text-align: center;
            text-decoration: underline;
        }
    </style>
</head>

<body>
    <h1><b>KES Shroff Junior College of Arts & Commerce</b></h1>
    <form>
        <h2 align="center">Enrollment Form</h2>
        Name &nbsp;<input type="text"><br><br>
        Email &nbsp;<input type="email"><br><br>
        <input type="submit" value="Submit">
    </form>
    <center>
        <h3><a href="page1.html">Home page</a></h3>
    </center>
</body>

</html>

Then save the file .

First Page      ===   page1.HTML
Second Page  ===  page2.HTML


*NOTE THAT BOTH THE FILE MUST BE IN SAME FOLDER*



EXPLAINATION OF CODE SYNATX USE :- 

title

  • Sets the name on the browser tab.

style

  • Applies colors, fonts, alignment, and underlines to headings and paragraphs.

body

  • The main visible content of the page.

h1

  • A big heading displaying the college name.

p

  • A paragraph describing the college. It's bold, red, and italic.

mark

  • Highlights the award text in yellow.

image

  • Displays a college building image with a border.

link

  • Clicking the link takes the user to Page 2 (the form page).



Output for following codes:- 


Page No 1

Page No 2


Comment below and share to your Friends and you can also give suggestion regarding my blog below and follow me to get blog daily .


Location: Mumbai, Maharashtra, India

Comments

Post a Comment