Skip to main content

HTML WORK 4

 

Create a file and save it as tutorial1.html.

  1. Your Web Page should follow the following specifications.
    • Ensure you include all the HTM tags every web page must have:

<!doctype html>
<html lang="en"></html>
<head></head
<meta charset="UTF-8">
<title></title>
<body></body>

    • 'Tutorial 1' for the title.
    • 'Tutorial 1 (your name)' using a <h1> heading element.
    • A quick presentation of yourself (5 lines - e.g., your course, hobbies, etc) using 2 different formatting tags. Use paragraph elements to separate these lines.
    • A ruler acting as a separator.
    • Under the ruler:
      • Your email address inside an address element
      • The last modified date (just add today’s date).
  1. View your web page in a browser. Find your file - double-clicking this file or dragging it into a web browser should open it for viewing.
  2. Keep both your text editor and browser open. You can then make changes in the text editor and refresh the browser window to see those changes.
  3. When you are happy with your results check if your markup is syntactically valid using the Validator at:

https://validator.w3.org/

    • Use the ‘Validate by File Upload’ or ‘Validate by Direct Input’.

Task 2 - CSS

  1. Add an embedded stylesheet to the HTML document.
  2. Add the following style to the body selector:
    font-family: Helvetica, Verdana, sans-serif;
  3. Apply the following rule to the <h1> element. Replace the color blue with a hex color value of your choice.
    background-color: blue;
  4. Set the font size for the page to "20px", and the font size for <h1> to "2.5em".
  5. Center align the text in the <h1> element.
  6. Change the text color of all the <p> and <address> elements to blue or a hex color value of your choice. Use one definition to apply this style to both elements.
  7. Define an id that applies text-transform (capitalize, uppercase or lowercase) and then apply to one of the paragraph elements.
  8. Define a class that applies a font color of your choice to two parts of your web page. You can use a span element if you want to target inline text within a paragraph element.



Answer


<!doctype html>
<html lang="en">

<head>
<meta charset="UTF-8">
<title>Tutorial 1</title>
</head>

<style>
body{font-family: Helvetica, Verdana, sans-serif;font-size:20px;}
h1{font-size:2.5em;text-align:center;background-color: blue;}
address.b{color:brown;}
#A{text-transform:uppercase;}
.a{color:red;}
</style>

<body>
<h1>Tutorial 1(Sajith Nirmana)</h1>
<div class="a">
<p>I'm sajith form srilanaka,<span style="color:blue"><i><strong>22 years</strong></i></span> old boy.</p><p id="A">I live in <b>matara</b>,it is small city.</p>
</div>
<hr>
Email address-
<address class="b">nirmansajith@gmail.com</address>
Date-2020/05/06
</body>
</html>

Comments

Post a Comment

Popular posts from this blog

Cyber Security And Computer Security

Introduction of Cybersecurity. Cybersecurity is the security of Internet-connected frameworks, counting equipment, computer program, and information from cyber assaults. It is made up of two words one is cyber and the other is security. Cyber is related to innovation which contains frameworks, arranges, and programs or information. While security is related to security which incorporates frameworks security, arranges security, and application and data security. It is the body of advances, forms, and hones planned to secure systems, gadgets, programs, and information from assault, robbery, harm, alteration or unauthorized get to. It may moreover be alluded to as data innovation security.   Introduction of computer security. computer security is the security of computer frameworks and data from hurt, robbery, and unauthorized utilize. The most reason clients get assaulted as often as possible is that they need satisfactory resistance to keep out interlopers, and cybercriminals ar
Post a Comment
Read more