0% found this document useful (0 votes)
39 views

Program No 2 (Web Tech)

The document provides HTML code to display a CV on a web browser. It includes various HTML tags such as <h1>-<h6> for headings, <p> for paragraphs, <div> for sections, <table> for displaying educational qualifications, <ul> and <li> for lists, and <a> for hyperlinks. It also includes CSS code to style elements like headings, tables, lists etc. The HTML code displays the applicant's personal details, educational qualifications, skills, experience, and other relevant information on the web browser.

Uploaded by

hello
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
39 views

Program No 2 (Web Tech)

The document provides HTML code to display a CV on a web browser. It includes various HTML tags such as <h1>-<h6> for headings, <p> for paragraphs, <div> for sections, <table> for displaying educational qualifications, <ul> and <li> for lists, and <a> for hyperlinks. It also includes CSS code to style elements like headings, tables, lists etc. The HTML code displays the applicant's personal details, educational qualifications, skills, experience, and other relevant information on the web browser.

Uploaded by

hello
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 13

Program No.

2
Objective: Write HTML code :
a) To display your CV in navigator:-
Theory:- HTML tags used in this program are :

i. The <h1> to <h6> tags are used to define HTML headings.<h1> defines the


most important heading. <h6> defines the least important heading.

ii. <p>:- Defines a paragraph.

iii. <style>:- The <style> tag is used to define style information (CSS) for a


document.

iv. <form>:- The <form> tag is used to create an HTML form for user input.

v. <div>:- The <div> tag defines a division or a section in an HTML


document.The <div> tag is used as a container for HTML elements - which is
then styled with CSS or manipulated with JavaScript.The <div> tag is easily
styled by using the class or id attribute.

vi. <input>:- The <input> tag specifies an input field where the user can enter
data.

vii. <span>:- The <span> tag is an inline container used to mark up a part of a text,


or a part of a document.The <span> tag is easily styled by CSS or manipulated
with JavaScript using the class or id attribute.

viii. <link>:- Defines the relationship between a document and an external


resource (most used to link to style sheets).
ix. <ol>:- Defines an ordered list.
x. <li>:- Defines a list item.
xi. <ul>:- Defines an unordered list.
xii. <table>:- Defines a table.
xiii. <thead>:- Groups the header content in a table.
xiv. <tbody>:- Groups the body content in a table.
xv. <th>:- Defines a header cell in a table.
xvi. <tr>:- Defines a row in a table.
xvii. <td>:- Defines a cell in a table.

Source Code:-

HTML code for the CV:-


<!DOCTYPE html>

<html>

 <head>

<link type="text/css" rel="stylesheet" href="practical2.1.css"/>

<title></title>

</head>

<body>

<div id="header">

<p id="name">Deval Jhingran</p>

         <a href="mailto:[email protected]" target="_blank"><p id="email">devaljhi
[email protected]</p></a>

         <p id="contact">+91 70173 85364</p>

     </div>

     <div class="left">

     </div>

     <div class="right">

            <h3>CV Highlights</h3>

            <p>

            <ul>

                <li>Currently working on DSA skills in C++ language</li>

                <li>Learnt basic Python,HTML,CSS,C++ from  <a href="https://www.youtube.com/" t
arget="_blank">–youtube.com</a>

</li>

                <li>An independent, dedicated, efficient person. These attributes are proved throu
gh the series of courses I have taken or I am taking as of now independently through online 
platforms.</li>
                <li>Good Communication Skills, Presentation Skills, attitude towards leadership, aut
horisation and delegation, conflict resolution and negotiation and a very good team worker.
</li></ul>

            </p>

            <h3>Professional Experience</h3>

            

            <p>None</p>

            <h3>Educational Qualifications</h3>

            <table>

                <tr id="heading">

                    <td>Institution</td>

                    <td>Board</td>

                    <td>Percentage / Grades</td>

                    <td>Year</td>

                </tr>

                <tr>

                    <td>K.C.M(10th board)</td>

                    <td>C.B.S.E</td>

                    <td>89.3%</td>

                    <td>2015</td>

                </tr>

                <tr>

                    <td>K.C.M(12th board Science stream)</td>

                    <td>C.B.S.E</td>

                    <td>85.6%</td>
                    <td>2017</td>

                </tr>

                <tr>

                    <td>B.tech(Computer Science)</td>

                    <td>M.I.T(Moradabad Institute of Technology),Moradabad(uttar pradesh),India<
/td>

                    <td>8.0 S.G.P.A</td>

                    <td>2022</td>

                </tr>

               

            </table>

            <h3>Independent Courses</h3>

            <p>

            <ul>

                <li>

                <span id="course-name">C++ 14(basic)</span> <a href="https://www.hackerrank.c
om/devaljhingran30" target="_blank">–Hackerrank.com</a></li>

            </ul>

            <h3>Technical Skills</h3>

            <p>

            <ul>

               

                <li>

                <span id="course-name">Programming Skills:</span>HTML, CSS, Python, JavaScrip
t, learning C and C++</li></ul>

            </p>
            <h3>Certifications / Awards:</h3>

            <p>

            <ul>

                <li>Secured 95% and a gold medal in NPTEL-soft skills and communication course</l
i>

            </p>

            <h3>Personal Information:</h3>

            <p>

            <ul>

                <li>

                A young, determined hard and smart working person. I believe in task based roles a
nd complete ownership of work.

                <li>

                <span id="course-name">Languages Known:</span>English, Hindi</li>

                <li>

                <span id="course-name">Hobbies:</span>I love  listening music, surfing Internet, s
elf-learning through e-courses.</li> </ul>

            </p>

            <h3>Other Information</h3>

            <p>

            <ul>

                <li>

                <span id="course-name">Expected Salary:</span>As per company standards</li>

                <li>

                <span id="course-name">Area of Interest:</span>Software Development, Program
ming, Start-ups, Coding</li>
                <li>

                <span id="course-name">Joining Date:</span>Immediate</li></ul>

            </p>

            <h3>Declaration</h3>

            <p>

            I hereby declare that the details furnished above are true and correct to the best of m
y knowledge and belief.</p>

      

     <h3>Websites</h3>

     <p>

         <ul>

             <li>M.I.T College: <a href="https://www.mitmoradabad.edu.in/" target="_blank">M.
I.T</a></li>

             <li>MComputer Science Department: <a href="https://www.mitmoradabad.edu.in/c
omputer-science-engg/" target="_blank">C.S Department</a></li>

             <li>C++ tutorial: <a href="https://www.geeksforgeeks.org/cpp-tutorial/" target="_bla
nk">C++</a></li>

         </ul>

     </p>

    </div>

     <div id="footer"></div>

    </body>

</html>

CSS Stylesheet for the CV:-


div

    border-radius: 5px;

    }

#header

    position: fixed;

    z-index: 1;

    height:40px;

    width: 98%;

    background-color: #668284;

    margin-bottom: 10px

    }

#name {

    float:left;

    margin-left: 20px;

    padding-bottom: 10px;

    font-size: 16px;

    font-family: Verdana, sans-serif;

    color: #ffffff;

#email{
    float:right;

    margin-right: 20px;

    padding-bottom: 10px;

    font-size: 16px;

    font-family: Verdana, sans-serif;

    color: #ffffff;

#contact

    margin-left:45%;

    padding-bottom: 10px;

    font-size: 16px;

    font-family: Verdana, sans-serif;

    color: #ffffff;

    }

a:hover {

    font-weight: bold;

.right

    float: left;
    margin-top: 50px;

    padding-left:5px;

    /*margin-right: -10px;

    margin-left: 14%;*/

    height: auto;

    width: 99%;

    background-color: #E3EDD8;

    }

/*.left

    float: left;

    margin-top: 50px;

    /*margin-right: -90px;

    height: relative;

    width: 10%;

    background-color: #4160E8;

    }*/

    

#footer

    height:40px;

    clear:both;

    position: relative;
    background-color: #C1E3E1;

    }

    

h3

    text-decoration: underline;

    }

#job-responsibilities

    padding: 1px;

    }

.job-title

    font-weight: bold;

    }

table

    border: 1px dashed black;

    }

td

    padding: 2px;

    border: 1px solid #E88741;
    }

#course-name

    font-weight:bold;

    }

#company-name

    height:2px;

    text-decoration:underline;

    }

#job-title

    height: 5px;

    }

.job-duration

    float:right;

    }

#heading

    font-weight:bold;

    }
Output:-

You might also like