Scribd Logo
Upload

Welcome to Scribd!

  • CS115 Lab 6

    Uploaded by

    Kareem Abdo
    10 views6 pages
    CS

    Original Title

    CS115Lab6

    Copyright

    © © All Rights Reserved

    Available Formats

    PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document
    CS

    Copyright:

    © All Rights Reserved
    Download as PDF, TXT or read online from Scribd
    Flag for inappropriate content
    10 views6 pages

    CS115 Lab 6

    Uploaded by

    Kareem Abdo
    CS

    Copyright:

    © All Rights Reserved
    Download as PDF, TXT or read online from Scribd
    Flag for inappropriate content
    of 6

    Computing Fundamentals CS1150 __________ Lab NO.

    6: HTML Part 2

    In this assignment you will practice with HTML and CSS (Cascading Style Sheets).

    You will make an HTML web page. In addition, you will add styles to your webpage using CSS properties.

    Task 1
    Go to the C:\\ drive and create a folder named HTMLCSS.

    Download the text file “HTMLAssignment2Text.txt” into the folder (content is courtesy of wkiHow editors
    Maria, Flickety, Arun, Katie R. and 32 others). This file contains the text that you will need on your
    webpage. You will use this file to copy text and paste on your webpage.

    You will need to embed 14 images in your webpage. Download all fourteen images onto your HTMLCSS
    folder. The images are named interview1.jpg, interview2.jpg, …, interview14.jpg. When you embed these
    images, the sizes of most of them needs to be 300x300 pixels. For a one of them (“interviw6.jpg”), the size
    needs to be less than that. Download the pdf file “How to Prepare for a Job Interview” into your HTMLCSS
    folder. This file shows you how your webpage should look in the end.

    Task 2
    Create a new html file using Notepad. Name your file JobInterviewTips.html. Put all the necessary tags in
    your file, then start to copy text from “HTMLAssignment2Text.txt” into your html file. Remember that any
    html file must have at least the following code:

    <!Doctype HTML>

    <html>

    <head><title>………………… </title>

    <style>

    …………………

    </style>

    </head>

    <body>

    …………………

    </body>

    </html>

    Page 1 of 6
    Computing Fundamentals CS1150 __________ Lab NO. 6: HTML Part 2
    Note the following style considerations:

    • The title of the webpage is “How to Prepare for a Job Interview”


    • The font-family property of <body> is arial.
    • Incorporate any group of paragraphs within the heading “part x of 3” into a <div>
    • The width of any <div> section should be 75%
    • any <div> should have the properties border-style:solid; border-color:beige; width:75%

    In addition look at the notes on this webpage snapshot:

    Page 2 of 6
    Computing Fundamentals CS1150 __________ Lab NO. 6: HTML Part 2
    Finally, make the links at the top of the page. You should use the anchor tag <a href=”so and so”> each one
    of these links take us to the corresponding title. Note the following snapshot:

    As for the titles “Part 1 of 3: Before the Interview”, “Part 2 of 3: The Day of the Interview”, and “Part 3 of 3:
    After the Interview”, we need to also surround them with the anchor tag as in the snapshots below.

    Page 3 of 6
    Computing Fundamentals CS1150 __________ Lab NO. 6: HTML Part 2

    Correspondingly, the three links at the top of the page should be as follows:

    Page 4 of 6
    Computing Fundamentals CS1150 __________ Lab NO. 6: HTML Part 2

    After your done, take a good look at the pdf file which shows how your webpage must look in the end and
    fix any defects you find.

    Below is a shortlist of CSS properties you may need to use:

    To make a style for a tag in the <style> section, see this example, which specifies style for <body> and <p>:

    Page 5 of 6
    Computing Fundamentals CS1150 ____ Lab NO. 5: HTML Part 2
    <style> body {font-family:arial}

    p {width:75%; font-family:arial}

    </style>

    But to make a style for a tag inside the tag itself, see this example which styles a paragraph:

    <p style=”width:75%;font-family:arial”>

    …………………

    </p>

    Page 6 of 6

    You might also like