WEB DESIGNING MODULE

WEB PAGEDESIGNING

(using HTML)

MODULE

Information and Communication Technology – WEB PAGE DESIGNINGPrepared by: ANABELLE D. BAYSIC Page 1

Modulee STARTING WITH HTML

After reading this module, the students should be able to:

a.) Define HTML

b.) Understand the common internet domains

c.) Determine the requirements in creating a Web page using the

HTML

d.) Identify the elements of the Web page

e.) Know how to save the html file using notepad

In 1990, Tim Berners-Lee invented the HTML. HTML stands for HyperText Markup

Language. This is the Languange used to create and link Web pages together. It is the

“mother tongue” of your website. An HTML document consists of only text – the main

text of the document and special instructions called tags. A Web page is designed by

using tags. Tags are the basic coding units in the HTML system. They are key words

or phrases that are enclosed by angle brackets <>. Tags describe how graphics and

text are to be displayed. They are also used to create links between documents. HTML

is run by a Web browser like Internet Explorer, Mozilla Firefox and Google Chrome.

These are the tools that can be displayed and run HTML documents and their links.


1

WEB PAGE


HTML Code

DEFINITION OF TERMS

WWW - World Wide Web

HTML - HyperText Markup Language.

URL - Uniform Resource Locator.

Web Page - is the lingua franca of the web. A group of electronic files stored on computers all over the world containing a vast of information.

Website - a site or location on the world wide web. It may consists of one or more pages that related to a common theme, such as a person, business, organization, or any other subject.

Web Browser - is the software that you need in order to find, retrieve, view, and send information on the internet. Examples are google chrome, mozilla firefox, internet explorer, and opera mini, etc.

Download - to transfer a file from another system to your own computer system via a modem over telephone or cable lines.

Upload – to transfer a file from your computer system to another system.

FAQ – Frequently Asked Question

Firewall – software that limits certain kinds of access to a computer from a network or other outside source.

GIF – Graphical User Interface, consist of 256 colors.

JPEG – Joint Photographic Expert Group, consist of 16.7 million colors.

PNG – Portable Network Graphics

Home Page – is the navigation center for the website.


Modem – Modulator Demodulator, used between a computer and a phone or cable to transmit signal to and from the internet in a form of computer’s digital to an analog signal and vice versa.

TCP/IP – Transmission Control Protocol/Internet Protocol

Chat – a form of a real time communication where participants type what they want to say and repeated on the screen of the other participants.

COMMON INTERNET DOMAINS

DOMAIN WHEN IS IT USED? AN EXAMPLE

.com

.edu

- Companies that are trying to make money

- High school, colleges &Universities

- General Motors – GM.com

- UST – UST.edu

.gov

.org

- Government,or government-related entities

- Special (usually non-profit) organizations

- The White House – Whitehouse.gov

- Consortium.org


.net

.xx- Internet service provider- Country code

INQ7.net- Philippines - .ph- Canada- .ca- Australia- .au- France- .fr

REQUIREMENTS IN CREATING A WEB PAGE USING THE HTML

1. Editor – using the Notepad (source code) in text and extension name - .html or .htm.

2. Browser – usually internet explorer as it is designed by microsoft.

3. Program in HTML (syntax)

Syntax: <Html><Head><Title></Title>


<Body></Body></Html>

ELEMENTS OF A WEB PAGE

BASIC CODES OR TAGS AND ITS MEANING

<HTML></html>

<HEAD> HEADING

</HEAD>

<TITLE>

- a guide to browser

- a larger font size text, usually bold or italic in style, showing the different sections of a page

- close tag for the head

- displays the browser’s title bar. It is the name assigned to the page if you add it to the browser’s list of favorites

- close tag for the title

- contains your documents or info.

- closing the body tag

</TITLE>

<BODY>

</BODY>


- Inline images that display lines across the page to separate different sections

- Graphics, icons, bullets, line photos, or pictures that are not part of the HTML file.

- a type of inline image that defines hotspots. These are areas that activate functions when selected.

- The text that makes up the main content of the Web page. It has many formats. It can be in paragraph form or bulleted list.

<HR> HORIZONTAL RULE

IMAGE

IMAGEMAP

NORMAL TEXT

<BG> BACKGROUND

ANIMATED IMAGES

- The wallpaper of the Web page. It can be a solid color, a picture or a graphic, or a default standard with white or gray background.

- inline images that include motion and animation. These images are more attractive to the user.

- Text, phrases, or graphics that help the user to navigate more on the Web page. By clicking the links, the browser goes to a location in a file or to request a file from the server.

- means break or line space

- a blank line is inserted between text

- preformatted

- text

LINKS<BODY></BODY>

<BR> BREAK

<P> PARAGRAPH

<pre></pre>

<font></font>


Title

Links Image/Animated

HeadingHorizontal Rule

Normal Text

Image

Body

Imagemap

Background

STARTING NOTEPAD

Notepad has different parts, namely, the main menu bar, the scroll bars, and the text are. The main menu bar displays all the commands in the program. The scroll bar is used to display different portions of the text file in the window. There are two kinds of scroll bars: the vertical and the horizontal scroll bars. The text area is the place where you input the text.


TO SAVE THE HTML FILE USING NOTEPAD

1. From the Menu bar, click the File menu and then click Save or Save As. The Save As dialog box displays and changes the Save-in box to the target folder or drive.2. Type the filename inside the Filename box below. (Remember to use an .HTML extension for the file name.)3. Then click the Save button.


Module

TO DISPLAY THE HTML FILE TO THE BROWSER1. Click the Start button, then Program.2. Look for the default browser, then double click.


HTML TAGS


a.) Define tags

b.) Apply the rules in using tags

c.) Enumerate the main types of tags

d.) Identify the Tags and their functions

e.) Know the heading tags for formatting texts

f.) Understand the formatting in text tags

g.) Know how to create a list

TAGS are sets of instructions that tell the browsers what layout of text to use, what graphics to be displayed, and where or what links are needed.

RULES IN USING TAGS

1. Each tag must be enclosed in <brackets>.2. You can use small or capital letters.3. Most tags come in pairs: the starting tag and the ending tag. Example:

<HTML> (starting tag)</HTML> (ending tag)

4. The browser ignores spaces around the tags. To read the codes easily, it is advisable to put spaces around the tags.

MAIN TYPES OF TAGS


2

TYPES TAGS MEANING

1. Document Structure

<HTML><HEAD><TITLE> BOOK</TITLE></HEAD><BODY>BOOK CRAFT</BODY></HTML>

Lets you set up the basic structure of your Web pages.

OUTPUT

2. Formatting

<HTML><HEAD><TITLE> BOOK</TITLE></HEAD><BODY><H1>BOOK CRAFT</H1><H3>PUBLISHING</H3></BODY></HTML>

Lets you change the appearance of the text.

OUTPUT


3. Links

<HTML><HEAD><TITLE> BOOK</TITLE></HEAD><BODY><H1>BOOK CRAFT</H1><H3>PUBLISHING</H3><AHREF=“C:\publication.htm”>journals</A></BODY></HTML>

Allows readers to choose highlighted text or an image from your Web pages to go to other Web pages.

OUTPUT

4. Image

<HTML><HEAD><TITLE> BOOK</TITLE></HEAD><BODY><IMGSRC=“C:\image\Bookcraft.gif”ALIGN=“left”><H1>BOOK CRAFT</H1><H3>PUBLISHING</H3></BODY></HTML>

Allows you to add images to your web pages


OUTPUT

TAGS AND THEIR FUNCTIONS

COMMAND FUNCTION

<HTML></HTML> The beginning and the end of the HTML document.

<HEAD></HEAD>Used for header information. It is the beginning and the end of the section of the document.

<TITLE></TITLE>

Indicates the beginning and the end of the title. The title is not displayed in the body of the Web page but on the title bar of the browser.

<BODY></BODY> Indicates the beginning and the end of the contents of the body of the Web page.

HEADING TAGS FOR FORMATTING TEXT


<H*> AND </H*>

This indicates the beginning and the end of the heading section. “H” represents the heading and “*” represents the size. <H1> is the largest and <H6> is the smallest. Heading separates text and introduces new topics on the Web page. It varies in sizes. Text formatted with heading appears differently in the Web browsers if different points are used.

<H1>Heading 1</H1>- 24 point in size<H2>Heading 2</H2>- 18 point in size<H3>Heading 3</H3> - 14 point in size<H4>Heading 4</H4>- 12 point in size<H5>Heading 5</H5> - 10 point in size<H6>Heading 6 </H6>- 7 point in size

Syntax Output

FORMATTING TEXT TAGS


The Text formatting feature is a powerful tool for organizing the content of your Web pages and for easier navigation. The HTML tags <BR> and <P> are used to format the text. They control the space between the lines of text and point where lines break on the screen.

COMMAND FUNCTION

<P> - Indicates the beginning of the paragraph and inserts a blank line before and above the paragraph. It does not need a closing tag.

- Inserts a horizontal line

- Breaks a line text and marks the start of a new line. It does not need a closing tag.

<HR>

<BR>

SyntaxOutput

CREATING LIST

THREE BASIC TYPES OF LISTS:


1. Unordered List2. Ordered List3. Definition List

UNORDERED LIST ORDERED LIST

• Bullet characters appear in place of the number next to the item

• Sequential numbers appear

• An ideal format for steps, rankings, and other sets of information for which order is stressed

• Works well for listing of items equally important and order does not matter

UNORDERED LIST

TAG NAME FUNCTION SYNTAX

Unordered List tags

List Item tag

- Also known as unnumbered list or bulleted list, formats information as bullet points. This tag creates an unordered or bulleted list.

- Denotes an item on the list

<UL TYPE=“disc/square/circle”compact> list items content </UL>

<LI> list item

To use Unordered List tags


Syntax Output

ORDERED LIST


Ordered List tag

List Item tag

Creates an ordered or numbered list

Denotes an item on the list

<OL TYPE=“1/A/a/I/”START=“start value”compact> list item content </OL>

<LI> list item content </LI>

To use Ordered List tags


Syntax Output

DEFINITION LIST


Definition List tag

Definition Term tag

Term’s Definition tag

Denotes a definition list

Contains a term to be defined in the definition list

Contains a term’s definition

<DL> terms and definition content </DL>

<DT> terms being defined content</DT>

<DD> term definition content </DD>

To use Definition List tags


Module

Syntax

Output

TEXT FORMATTING


a.) Define text formatting

b.) Enumerate the types of text formatting

c.) Identify the text formatting and their functions


3

d.) Know the importance of text formatting

Text formatting is a styling or changing the appearance of a text. It includes change in colors, size, font, and alignment.

TYPES OF TEXT FORMATTING1. Text-Level Formatting – is a formatting for a text or group of text.

Tag Name Syntax Function1. Bold face <b> text </b> Contains text in boldface image.

2. Italics <i> text </i>Contains text which you want to be italic in format.

3. Strikethrough <s> text </s> Contains the text to be marked

4. Typewriter <tt> text </tt>Contains the text to be rendered in a fixed-width font or some kind of typewriter font.

5. Underline <u> text </u>Contains text to be rendered with an underline.

6. Font Tag<font color=”#” size=”#”

face=”font face”>Contains the text properties to be modified.

SyntaxOutput


1. Text-Level Formatting – is a formatting for a text or group of text.

Tag Name Syntax Function

1. Emphasize <em> text </em>Contains the text to be emphasized. It is typically rendered in italics.

2. Superscript <sup> text </sup>Contains the text to be rendered as a superscript to the text that precedes it.

3. Subscript <sub> text </sub>Contains the text to be rendered as a subscript to the text that precedes it.

4. Strong <strong> text </strong>Contains the text to be strongly emphasized. It is typically rendered in boldface.

5. Big <big> text </big>Contains text to be rendered in a font size bigger than the default size.

6. Small <small> text </small>Contains text to be rendered in a font size smaller than the default size.

SyntaxOutput

2. Paragraph Formatting – is a formatting that controls the paragraph.


1. Line Break <br> This tag inserts a line break in a document.


2. Horizontal Rule<hr align=”center” color=”blue”

size=”30”>Places a horizontal line in the page.

3. Center <center>paragraph</center>Centers all text and other page components it contains.

4. Pre-formatted Text <pre>paragraph</pre>This tag is rendered in a fixed width font.

5. Division Alignment<div align=”left/right/center/

justify”>paragraph</div>

Defines the sections or divisions of a document that require special alignment.

6. Heading Levels<hn align=”left/right/center/

justify”>paragraph</hn>

Establishes the hierarchy of document heading levels and is rendered in boldface.

7. Paragraph<p align=”left/right/center/

justify”>paragraph</p>Denotes a paragraph

Syntax

Output


Module

IMPORTANCE OF TEXT FORMATTING

1. It makes your Web page appealing to the audience.2. It allows you to emphasize a certain word or text and idea on your Web page.3. It allows you to sort or organize the content of your Web page.

INSERTING IMAGES IN A WEB PAGE


a.) Define file format and images

b.) Analyze the standard format of image tag

c.) Apply the steps in inserting images in a Web page

d.) Know the advantages of adding image in a Web page

e.) Perform the rules for inserting background image

f.) Discuss the steps in creating a marquee

g.) Enumerate the reasons why image, background and marquee are

in important in creating a Web page

File format is the structure of how information is stored in a computer file.Imagessuch as pictures, graphics, or illustrations often taken from sensible objects and use to illustrate subject.


4

STANDARD FORMAT OF IMAGE TAG

The basic format of IMG:

Attribute

<IMG SRC=”luneta.jpg”>

Image Tag Image File

IMG stands for “image”. It tells to the browser that an image will go here on the page.

SRC stands for “source”. It tells the browser where to go to find the image.

The commonly used image file formats are: .gif and .jpeg.

STEPS IN ADDING IMAGES IN WEB PAGE

1. Place the cursor where you want to insert the image.2. Type <IMG SRC=”ImageName.jpg/gif/png width=”#’ height=”#”>

STEPS IN ALIGNING AN IMAGE TO THE CENTER

1. Type <CENTER> before the image you want to center align.2. Type </CENTER> after the image you want to center align


Syntax Output

ALIGNING IMAGE

The placement of the image on the page can be controlled by using the Image Align tag. Here are the different attributes of alignments.

Attribute Functionleft or right Aligns to the side and wraps the text above, around, and below it.top Aligns with the tallest item available.text top Aligns with the tallest text character availablemiddle Aligns the baseline of the current line with the middle of the image.absmiddle Aligns the middle of the current line with the middle of the image.baseline Aligns the bottom of the image with the baseline of the current line.bottomabsbottom Aligns the bottom of the image with the bottom of the current line.

ADDING BORDER TO THE IMAGE

You set the <IMG> tags BORDER attribute to the width of the border in pixels. Borders may be set from 0 to 10. If you set it to 0, you will not see any border.


Syntax Output

ADVANTAGES OF ADDING IMAGES IN A WEB PAGE

1. It provides content that is not available via text, such as scanned picture.2. It adds color, humor and excitement to the Web page.3. It attracts Netizens to visit your Website.4. It attracts buyers to purchase your products.

CREATING BACKGROUND

Background is what underneath another object.

1. Image


2. Color

Change in Color

Syntax Output


Image Form

SyntaxOutput

RULES FOR INSERTING BACKGROUND IMAGE

1. The image and the Web page should be saved on the same folder.2. The syntax and the file location of the picture should be typed correctly.

MARQUEE

Marquee is a small section of the browser window that displays text rolls across the screen.

Syntax

Output


MARQUEE ATTRIBUTES

Marquee Tag Attribute1. Direction “left”, “right”, “up”, or “down”2. Bgcolor “color” or “hexadecimal value”3. Scrolldelay “number”4. Height “number”5. Behavior “scroll”, “slide”, “alternate”6. Width “number”7. Loop “number” or “infinite”

Syntax


Output

Reasons why image,background and marquee are important in creating a Web page


Module

1. It grabs and keeps the attention of the viewer.2. It creates an overall impact to the design of your Web page.3. It adds more meaning to your content.


5

CREATING A HYPERLINK


a.) Define hyperlink

b.) Apply the steps in changing the color of a hyperlink text.

c.) Know the syntax increating a hyperlink on the Web page.

d.) Perform the steps in removing the underline of the hyperlink text.

e.) Discuss how to link image on the Web page.

f.) Enumerate the advantages and disadvantages of Hyperlink on the

Web page.

A hyperlink or link is a word, group of words, or image that you can click on to jump to another document. It is used to connect Web pages of different Web sites or Web servers anywhere in the world. The World Wide Web is composed of millions of linked Web pages. Hotspots are used to create a link. A hotspot is an area of a text or an image that notifies the visitor that there is a link on the text or image.

Syntax Output

Syntax Output



CHANGING THE COLOR OF THE HYPERLINK TEXT

There are different colors used in a link to indicate that it is a normal, visited, or an active link.

Attribute Function

Link Link color is the color without a mouse over it or before visited. The default color is usually blue.

Vlink Visited link controls the color of a link that has been clicked or visited. The default color is usually green or red.

Alink Active link controls the color of a link on which a mouse has been pressed but not clicked. The default color is usually green or red.

Syntax

Output

REMOVING THE UNDERLINE OF THE HYPERLINK TEXT


Syntax

OutputIMAGE LINK


The image link is used as the linking tool in connecting to another Web page or Web site.

Syntax

Output

ADVANTAGES OF HYPERLINK ON THE WEB PAGE


Module

1. It connects Web pages or Web sites which content are related to each other.2. It identifies the rank of the Web site basically for business Web sites.3. Without hyperlink there is no WWW because World Wide Web is a connection of interlinked hypertext document.

DISADVANTAGES OF HYPERLINK ON THE WEB PAGE

1. Some hyperlinks are dangerous because it hides malicious content.2. Some hyperlinks are also use for cybercrime. Once you click the hyperlink, it contained malwares/viruses and it can hack your email account.3. Some hyperlinks are destructive. Once you click it, the virus will automatically installed on your computer and attacked your softwares.


ADDING FORMS ON THE WEB PAGE


a.) Define Web forms

b.) Apply the steps in creating a form tag.

c.) Know the uses of two special buttons in form tag.

d.) Enumerate the Web form elements.

e.) Perform the steps in creating a password tag.

f.) Discuss the steps in creating check boxes.

g.) Determine the steps in adding radio buttons.

h.) State the purpose of html Web forms.

Adding Web forms to your Web pages, allows you to communicate through your Web site. Web form allows the user to enter information and provides predefined choices from which the user can select. It is made up of spaces where you can enter text information. A Web form is instantly submitted and most of the time they are also immediately responded to. Most forms include fields: text boxes or pull-down menus that allow user to input. The label explains what information is needed by an adjacent field.

CREATING FORM TAG

Creating form is easy. It can also appear anywhere on a Web page. The form tag has two attributes, ACTION and METHOD. They define how a particular form will behave, determine where the information entered by the user will go, and how it will be sent there.

Attribute Syntax Function


6

Form Tag

<Form Action=”url”></Form>

Describes what URL the information will be sent to. It tells the address where you will send this paper form. If an ACTION is committed, the URL of the page containing the form is used by default.

<Form Method=”post”></Form> Sends the form entry results as a document

<Form Method=”get”></Form>Submits the results as a part of the URL header instead.

TWO SPECIAL BUTTONS

1. Submit button – gathers all information entered in the form when it is clicked.2. Reset Button– clears the form and returns all the settings to their original default values.

Syntax Output

WEB FORM ELEMENTS



1. Input Text Tag <input type=”text” value=”text”>

It is where all fields within a form are specified. There is no need to put a closing INPUT tag.

2. Text Attribute <input text name=”Full Name” size=”40”>

text is the default, with SIZE used to specify size of the box that is created or how many characters wide the text area will be. The default size is 20 characters.


3. Text Area <textarea row=”#” cols=”#” text here! </textarea>

allows you to produce a box that can contain several lines of text. The TEXT AREA tag requires a unique name, specified with NAME=. You can specify the size of you text box by using the ROWS and COLS attributes. You have to put a closing tag for TEXT AREA.

4. Select <Select><option> text 1 </option><option> text 2 </option><option> text 3 </option>

</Select>

to create a list field in which some choices are hidden.

5. Option

The method to be used in order to limit your user’s choices.

Syntax Output


CREATING A PASSWORD TAG

Several Web sites would require the user to input a password to be able to access any of the Web pages.

The MAXLENGTH attribute specifies the maximum number of characters a user may enter into the field. If a MAXLENGTH is used, which is longer than the size of the text field, then the text field will scroll to allow the user to enter more data. If MAXLENGTH is not included in the code, the user may type any amount of text. But in most PASSWORD fields, you will notice that there is limitation on the number of characters that you can type.

Syntax


Output


CREATING CHECK BOXES

Check boxes allow users to make multiple selections from a list. They display an array of choices that are all visible at once, and from which users may select any, all, or none.

Syntax

Output


ADDING RADIO BUTTONS

To create a set of options that a user can see all at once, and from which a user can make only one selection, you can use radio buttons.

RADIO buttons are small white circles, each shown next to the label. They are similar to check boxes. In a RADIO button, the user is only allowed to make a single choice from the list by clicking a circle.

Syntax Output

PURPOSE OF HTML WEB FORMS

1. It allows the users to communicate with you through your Web site.2. It helps you to monitor who visited your Web site and get feedback from them.3. It is used to promote some advertisements, announcements, or events.


ModuleFORMATTING TABLES


a.) Define table

b.) Enumerate the table and border attributes.

c.) Determine the proper way of coding the table elements.

d.) Apply the spanning table column and row.

e.) Perform the cell padding and cell space adjusting.

f.) Dicuss working with width and height.

g.) Set the border color and background color for table row.

A table is useful to summarize data from a database search or a set of choices. With HTML tables, it’s not just text that can be placed inside but as well as pictures, links, and even video and sounds.

TABLE ATTRIBUTES

Tag Name Syntax FunctionTable Tag <table></table> Creates a basic tableTable Row tag <tr></tr> Contains several cellsTable Data tag <td></td> Creates individual cells

To display a border for table, use the BORDER attribute.

Attribute Syntax FunctionBORDER=0 <table border=”0”></table> Borders are invisibleBORDER=1 <table border=”1”></table> Borders are visibleBORDER=N

<table border=”2”></table>If you increase the value greater than 1, it will make the border thicker.


7

PROPER WAY OF CODING THE TABLE ELEMENTS:

Syntax

OutputSPANNING TABLE COLUMN AND ROW


<table><tr>

<td></td></tr>

</table>

A table heading oftentimes occupy more space than the rest. Spanning columns and rows enables you to create interesting grids and to manage areas of space within a table more completely.

Attribute FunctionCOLSPAN To span a columnROWSPAN To span a row

Syntax

OutputUSING CELLPADDING


Cellpadding sets the amount of space (both horizontal and vertical) between the cell wall and the contents. The default value of Cellpadding is 1. The text inside the box will look much better if you move it away from the border lines. It will look less crowded.

Syntax

Output

ADJUSTING CELL SPACE


Cellspacing allows you to increase or decrease the amount of space between the cells of the tables.

Syntax

Output

WORKING WITH WIDTH AND HEIGHT


Table width and height allows you to control the width and height of the table.

Syntax

OutputSETTING BORDER COLOR AND BACKGROUND COLOR FOR TABLE ROW


Module

These attributes sets the colors of the borders and the background for a table row.

Syntax

Output


8

CREATING FRAMES


a.) Define frames

b.) Enumerate the attributes of frame tag.

c.) Apply the steps in setting frameset column.

d.) Know how to specify rows

e.) Perform the attributes in formatting frames.

Frames divide the browser window into parts, each of which appears as a separate HTML document. Frames work very much like Tables. They are used to divide the screen into two or more Web pages, and simultaneously display their contents in a single browser window. Frames are used to assist in the navigation of many pages over a large number of topics.


Frameset <frameset></frameset>Marks frameset contents and describes their layout.

ATTRIBUTES OF A FRAME TAG


Rows Frameset rows=”50%,*”Defines number and sizes of horizontal frames to create

Cols Frameset cols=”70%,*”Defines number and sizes of vertical frames to create

Frameborder Frame border=”1”Turns border between frames on and off

The Frameset tag tells the browser to get more files to be placed on the page. The browser places all the files on one page.

Syntax


Output

SETTING FRAMESET COLUMN

The value of this attribute defines the column width of each column (horizontal) within the frameset. Each column width must be defined in terms of pixels (fixed), percentage of browser window (variables), or as a relative value of space remaining (variable) using the “*” symbol.


Frame tag <Frame>Specifies a frame source file and name

Noframe tag <Noframes></Noframes>Defines alternate page content for browsers without frames


Below are the attributes of a Frame tag.

Attribute Function

SRC Defines location and filename for frame contents.

NAME Defines frame name for reference by hyperlinks.

Syntax

Output


SPECIFYING ROWS

The frameset row attributes specifies the row height of each row (vertical) within the frameset. It is measured in terms of pixels (fixed) percentage of the area of the browser window (variable), or as a relative value of space remaining (variable) using the “*” symbol.

SYNTAX OUTPUT

Syntax Output


FORMATTING FRAME

Below are the attributes of the Frameset tag.

Attribute Function

Frameborder Determines frames with or without borders: 0 or No – off borders, 1 or Yes enables border.

Border Specifies the space between frames in the latest browsers.

Framespacing Specifies the space between frames in the older browsers.

Border Color Customizes color of lines separating frames.


Below are the attributes of the Frame tag.

Attribute Function

Marginheight Specifies space between frame contents and top and bottom borders.

Marginwidth Specifies space between frame contents and left and right borders.

Noresize Stops users from changing a frame’s dimensions.

ScrollingControls the appearance of the frames: “YES” includes scrollbars and “NO” prevents the scroll bar to appear.

Syntax

OUTPUT


DepEd - ManilaMANILA SCIENCE HIGH SCHOOL

Taft Ave., cor. P. Faura St., Ermita, Manila


Module 1- Starting with HTMLPre-assessment A. B. C. D.Practical ExerciseModule Test


Education

WEB DESIGNING MODULE