08448380779 Call Girls In Diplomatic Enclave Women Seeking Men
Chapter 3 class power point
1. CHAPTER 3: UNIQUE HTML FEATURES
WEB DESIGN &
DEVELOPMENT
L A S T U P D AT E : 2 / 2 7 / 1 2
2. ESSENTIAL OUTCOMES
3. You will analyze and create unique features in
HTML by:
Writing and using scrolling marquees and
rollovers
Scrolling marque to left
Slide in Text
Bouncing Text
Upward Scroll
Rollovers
Inserting rounded edges in tables
Copying and pasting codes that secure a
website
No right click
Disable copy and paste
Define key words presented in this chapter.
3. SCROLLING MARQUES / BANNERS
o Scrolling text
o Use discretion
o Not all websites should have
scrolling banner
5. SCROLLING MARQUES / BANNERS ATTRIBUTE
o bgcolor=“green” (sets background
color)
o width=“100%” (sets width)
o direction=“Left” (sets direction)
o scrollamount=“1” (sets speed of
banner)
6. VARIOUS TYPES OF SCROLLING BANNERS
o Scrolling Marque from
Left
o Slide in Text
o Bouncing Text
o Upward Scroll
10. SCROLLING IMAGE WITH TEXT
<p align=“center”>
<marque bgcolor=“#000080”
behavior=“scroll” direction=“left”><font
size=“10 color=“#ffffff”
scrollamount=“2”>>Go Vikings<img
scroll text
here</strong></font</marque>
</p> (click here for ex.)
11. ROLLOVERS
• Displays separate images or text to
user once button or image has been
rolled over with mouse
• Need two images:
1. One image as button;
2. One image as rollover;
12. CREATING THE ROLLOVER
• Save your two images to your image
folder
• Go to where you want your rollover to
appear
• Write the following code:
<p align="center">
<a href="http://www.google.com"><img
src="Graphics/bugs-01.gif"
onmouseover="this.src='Graphics/bart-
09.gif'"
onmouseout="this.src='Graphics/bugs-
01.gif'" alt="Click Me"></a>
13. ROUNDING TABLES
• In web design, no rounded tables
• All images are rectangles
• Rounding tables: means that you
round the corner edges of the table
14. ROUNDING TABLES
• To create a semblance of rounded
tables:
• Need circle & the # of corners you
need (in this case 4 since we are rounding all
four corners)
1. Need 4 different images
2. In Photoshop, create a circle
Our starting Top-left Top-right Bottom-left Bottom-right
image corner corner corner corner
17. IMPORTANT NOTES IN ROUNDING TABLES
• When rounding corners, make
sure cellpadding, cellspacing &
border attributes have 0 value
• Background color for corners
must be same color as table
• Use the “alt” tag for images
(required)
• Do not use “bgcolor”; rather use
the following:
style=“background-color: #9c084A”
18. IMPORTANT NOTES IN ROUNDING TABLES
• Height of a table is controlled by
the actual content
• Roundness of a table depends
on curves created in image;
• Circle is small, curves will be
tighter;
• Circle is larger, curves will be
looser
19. SECURING YOUR WEBSITE
• For this, you may just copy and
paste codes since these include
JavaScript
• 3 codes:
No copy & paste of images
No right click
No copy & paste of information
• Codes are saved in Notepad++
for you to copy under Security