Html web designing background and rules
-
Upload
bong-francisco-jr -
Category
Technology
-
view
1.304 -
download
1
description
Transcript of Html web designing background and rules
![Page 1: Html web designing background and rules](https://reader033.fdocuments.net/reader033/viewer/2022061206/548289b5b07959240c8b4818/html5/thumbnails/1.jpg)
UNIT IIDESIGNING STATIC PAGES USING HTML
Chapter 8
ENHANCING WEB PAGE WITH BACKGROUND AND RULES
![Page 2: Html web designing background and rules](https://reader033.fdocuments.net/reader033/viewer/2022061206/548289b5b07959240c8b4818/html5/thumbnails/2.jpg)
![Page 3: Html web designing background and rules](https://reader033.fdocuments.net/reader033/viewer/2022061206/548289b5b07959240c8b4818/html5/thumbnails/3.jpg)
USING COLORS AND IMAGES AS BACKGROUND
REMINDERS ON PUTTING BACKGROUND COLORS and IMAGES
1. Consider the color harmony, a darker text color will be harmonious with lighter background and a lighter text color with a darker background.
Consider the file size of the image, the bigger the file ,the slower will load your web page.
![Page 4: Html web designing background and rules](https://reader033.fdocuments.net/reader033/viewer/2022061206/548289b5b07959240c8b4818/html5/thumbnails/4.jpg)
THE BGCOLOR ATTRIBUTE Background color tag <bgcolor> is
used to set the background color of the entire Web page. The syntax for putting background color is:
<body bgcolor= ncolor> where ncolor is n is the name/code of the color.
Ex. <body bgcolor= red>
Note: You can also used the HTML Color code.
![Page 5: Html web designing background and rules](https://reader033.fdocuments.net/reader033/viewer/2022061206/548289b5b07959240c8b4818/html5/thumbnails/5.jpg)
BACKGROUND IMAGE ATTRIBUTE BACKGROUND IMAGE TAG: Instead of
background color, you can also put an image on your Web page to serve as background attribute.
The syntax for adding image background is: <body background= ‘imagefile’> Where imagefile is the file name of the
image you want to put as background. Note: The images should be in the same folder of your
save web page documents.
![Page 6: Html web designing background and rules](https://reader033.fdocuments.net/reader033/viewer/2022061206/548289b5b07959240c8b4818/html5/thumbnails/6.jpg)
PUTTING HORIZONTAL RULES Web pages contain information on
different categories, so it a good practice to organize them properly into sections or divisions. To indicate these divisions, a horizontal rule (dividing line) is used. To add a dividing line, the <HR> tag is used.
The syntax is <HR>
![Page 7: Html web designing background and rules](https://reader033.fdocuments.net/reader033/viewer/2022061206/548289b5b07959240c8b4818/html5/thumbnails/7.jpg)
<HR> tag WIDTH Attribute The width of a dividing line depends on the
browser screen. For you to control the width of the line, you can
set the WIDTH attribute of the <HR> tag you desired thickness in either pixels or percentage of the width of the browser screen.
The syntax for using the WIDTH attribute is:
<HR WIDTH= pixels> or <HR WIDTH= percent>
Ex. <HR width= 50> or <HR width= 25%>
![Page 8: Html web designing background and rules](https://reader033.fdocuments.net/reader033/viewer/2022061206/548289b5b07959240c8b4818/html5/thumbnails/8.jpg)
The <HR> tag SIZE attribute Size attribute defines the thickness of a
line. The syntax to do this is:
<HR Size= pixels>
Ex. <HR Size= 1>
Note: The default size is 2 pixels
![Page 9: Html web designing background and rules](https://reader033.fdocuments.net/reader033/viewer/2022061206/548289b5b07959240c8b4818/html5/thumbnails/9.jpg)
<HR> tag ALIGN attribute HR are centered by default. To specify
your desired alignment, you set the ALIGN attribute of the <HR> tag to LEFT, RIGHT, or CENTER.
The syntax for doing this is:
<HR ALIGN= alignment>
Ex. <HR ALIGN= left>
<HR NOSHADE> if you don’t want the HR to have shading.