BIW 10103 | INTRO TO WEB TECHNOLOGY Semester II 2020/2021

 Lab #4:HTML COLORS & LISTS

CINDY BEH XIN YI

AI200259

INSTRUCTION

1.     By using Notepad, type the following text:

<html>

<head>

<title>My First Webpage</title>

</head>

<body bgcolor="#EDDD9E">

<h1 align="center">My First Webpage</h1>

<p>Welcome to my <strong>first</strong> webpage. I am writing this page using a text editor and plain old html. </p>

<p>By learning html, I'll be able to create web pages like a pro................................................ <br>

which I am of course.</p> Here's what I've learned:

<ul>

<li>How to use HTML tags</li>

<li>How to use HTML colours</li>

<li>How to create Lists</li>

</ul>

</body>

</html>

 

1.     Save the file as mypage3.html.

2.     Upload your work into the blog.

3.     Then, make a report and upload to Author.

 


QUESTIONS

1.     Explain about the HTML code above.

 

The HTML code above have the elements which is <html>, <head>, <title>, <body>, <body bgcolor="#EDDD9E">, <h1 align="center">, <p>, <strong> and <br>. I am going to explain these elements one by one.

 

Elements

Explanation

<html>

-       This is the root element which also the top-level element of an HTML page.

<head>

-       This contains meta information means data about data about the HTML page.

-       This element is placed between <html> tag and the <body> tag

<title>

-       This element specifies a title for the HTML page which is shown in the browser title bar or in the page’s tab.

-       This element is required in every HTML document.

-       It also category under <head> element.

-       This tag is used when we need to write a title in a website.

-       From the code above, the title is “My First Webpage”

<body>

-       This element defines the document’s body.

-       It is also a container for all the visible content such as headings, paragraphs, images, hyperlinks, tables, lists, etc.

-       This tag is used for insert text in body.

<body bgcolor="#EDDD9E">

-       This tag is use for color the webpage background by assigning the bgcolor to HEX value of the color in HTML code.

<h1 align = “center”>

-       This tag is used when we need to put text in center.

<p>

-       This tag is used to input paragraph and show in paragraph.

 

<strong>

-       The tag is used to define text with strong importance. The content inside is typically displayed in bold.

<br>

-       This tag means line break for the paragraph.

<ul>, <li>

-       The <ul> tag defines an unordered (bulleted) list.

-       Use <ul> tag together with the <li> tag to create unordered lists.

Eg. </head>

</h1>

</strong>

</p>

</ul>

</li>

</body>

</html>

-       The element with a slash “/” means it is end of the tag.


 

2.     Change the given HTML code by using an ordered list tags.

<ol type = “1”>

<li>How to use HTML tags</li>

<li>How to use HTML colours</li>

<li>How to create Lists</li>

</ol>

 

3.     List 10 colours HEX value in HTML codes.

-       AliceBlue “#F0F8FF”

-       AntiqueWhite “#FAEBD7”

-       Tomato “#FF6347”

-       Wheat “#F5DEB3”

-       Thistle “#D8BFD8”

-       Snow “#FFFAFA”

-       SlateBlue “#6A5ACD”

-       SkyBlue “#87CEEB”

-       Salmon “#FA8072

-       PeachPuff “#FFDAB9”

4.     Provide a HTML code for definition lists.

<dl>

<dt>How to use HTML tags</dt>

<dd>HTML tags used for create a webpage. </dd>

<dt>How to use HTML colours</dt>

<dd>By insert the HEX value of color. </dd>

<dt>How to create Lists</dt>

<dd>By using ul and li to make a list, while for order list start with ol. <dd>

</dl>


Comments

Post a Comment

Popular posts from this blog

Lab 06 HTML Form

Image
  Lab #6: HTML HTML Forms QUESTIONS 1.      Explain about the HTML code above. The HTML code above have the elements which is mainly use to make a form in html. I am going to explain these elements one by one. Elements Explanation <form action="/action_page.php"> -        This is the element which is a container for different types of input elements, such as text files, checkboxes, radio buttons, submit buttons. <label for="fname"> -        This element defines a label for several elements such as <input type = “text”> <input type="text" id="fname" name="fname" value=""> -        This element will display a single line text input field for users to input their data. <input type="submit" value="Submit"> -  ...
Read more

Lab 09 HTML Styles -CSS

Image
 CINDY BEH XIN YI  AI200259 Lab #9: HTML Styles - CSS INFORMATION CSS stands for Cascading Style Sheets. CSS saves a lot of work. It can control the layout of multiple web pages all at once . CSS describes how HTML elements are to be displayed on screen, paper, or in other media. CSS can be added to HTML elements in 3 ways: ·        Inline - by using the style attribute in HTML elements ·        Internal - by using a <style> element in the <head> section ·        External - by using an external CSS file INSTRUCTION 1.      By using Notepad, type the following text:     Example 1                                                    ...
Read more

Lab 07 HTML Radio & Check BIW 10103 INTRO TO WEB TECHNOLOGY

Image
 CINDY BEH XIN YI  AI200259 Lab 07 HTML Radio & Check INFORMATION HTML Forms   HTML Forms are required, when you want to collect some data from the site visitor. For example, during user registration you would like to collect information such as name, email address, credit card, etc. There are various form elements available like text fields, text area fields, drop-down menus, radio buttons, checkboxes, etc. The HTML <form> tag is used to create an HTML form and it has following syntax –   INSTRUCTION 1.      By using Notepad, type the following text: <!DOCTYPE html> <html> <body>   <h2> LAB-07 21-4-2020 </h2>   <h3> Example1 : Radio Button Input </h3>   <input type="radio" name="gender" value="male" checked> Male<br> <input type="radio" name="gender" value="female"...
Read more